Mengatasi konflik antar JQuery

19 April 2014

Konflik atau bentrok antar JQuery biasanya terjadi ketika memasang lebih dari satu script JQuery pada website, dan biasanya pula yang sering terjadi bentrok adalah file jquery.js dengan jquery.min.js, misalkan kita punya website yang menggunakan slider (memakai jquery.js), kemudian kita memasang livechat (memakai jquery.min.js), mungkin ketika kita ingin menampilkan maka ada salah satu bagian yang tidak bekerja sebagai misal slidernya tidak bergerak atau chatnya tidak muncul.

Bagaimana cara mengatasi konflik antar Jquery tersebut. Perhatikan contoh script yang belum ditambahkan deklarasi untuk mengatasi konflik:

1. $(document).ready(function(){

2. $("a.slick").click(function () {

3. $(".active").removeClass("active");

4. $(this).addClass("active");

5. $(".content-slick").slideUp();var content_show =

6. $(this).attr("title");

7. $("#"+content_show).slideDown();

8. });

9. });

Script diatas sebenarnya sudah berjalan dengan baik akan tetapi nyatanya bentrok sangat mudah terjadi. Perhatikan contoh script yang sudah ditambahkan deklarasi untuk mengatasi konflik:

1. var $jnoc = jQuery.noConflict();

2. $jnoc(document).ready(function(){

3. $jnoc("a.slick").click(function () {

4. $jnoc(".active").removeClass("active");

5. $jnoc(this).addClass("active");

6. $jnoc(".content-slick").slideUp();var content_show =

7. $jnoc(this).attr("title");

8. $jnoc("#"+content_show).slideDown();

9. });

10. });

Bandingkan contoh script diatas maka kita akan menemukan perbedaan yang sebenarnya sangat sederhana.Penjelasan:var $jnoc = jQuery.noConflict(); adalah script untuk mendeklarasikan fungsi jQuery.noConflict yang berfungsi untuk mengatasi konflik-konflik JavaScript$jnoc pada script berikutnya merupakan script untuk menggantikan fungsi dasar simbol "$". Jika di perhatikan maka sebenarnya semua simbol "$" tergantikan oleh script jQuery.noConflict hanya diwakilkan kepada script $jnoc yang sudah dideklarasikan sebelumnya pada baris 1.

$jnoc bisa saja diganti dengan kata apapun sesuai dengan keinginan, asalkan sesuai dengan kata yang dideklarasikan sebelumnya sebagai wakil dari script jQuery.noConflict pada baris 1.


Sumber : Jasa Pembuatan Website dan Sistem Informasi http://klatenweb.com
Selengkapnya : http://klatenweb.com/read/2014/04/19/1086/Mengatasi-konflik-antar-JQuery.html