Metode jQuery noConflict()

Bagaimana cara untuk menggunakan jQuery dan framework lainnya pada halaman?

jQuery dan framework JavaScript lainnya

Sebagai yang anda tahu, jQuery menggunakan simbol $ sebagai singkatan untuk jQuery.

Apa jika kerangka kerja JavaScript lainnya juga menggunakan simbol $ sebagai singkatan?

Beberapa kerangka kerja JavaScript lainnya termasuk: MooTools, Backbone, Sammy, Cappuccino, Knockout, JavaScript MVC, Google Web Toolkit, Google Closure, Ember, Batman serta Ext JS.

Beberapa kerangka kerja juga menggunakan simbol $ sebagai singkatan (seperti jQuery), jika dua kerangka kerja yang berbeda yang anda gunakan menggunakan simbol singkatan yang sama, mungkin dapat menyebabkan skrip berhenti berjalan.

Tim jQuery menimbang isu ini dan melaksanakan metode noConflict().

Metode jQuery noConflict()

Metode noConflict() akan melepaskan kontrol atas penanda $, sehingga skrip lain dapat menggunakannya.

Contoh

Tentu, Anda masih dapat menggunakan singkatan penuh untuk menggunakan jQuery:

$.noConflict();
jQuery(document).ready(function(){
  jQuery("button").click(function(){
    jQuery("p").text("jQuery masih berjalan!");
  });
});

Coba sendiri

Contoh

Anda juga dapat membuat singkatan sendiri. Metode noConflict() dapat mengembalikan referensi jQuery, Anda dapat menampungnya di variabel untuk digunakan nanti. Lihat contoh ini:

var jq = $.noConflict();
jq(document).ready(function(){
  jq("button").click(function(){
    jq("p").text("jQuery masih berjalan!");
  });
});

Coba sendiri

Contoh

Jika blok kode jQuery anda menggunakan singkatan $ dan anda tidak ingin mengubah penanda ini, anda dapat membawa simbol $ sebagai variabel ke metode ready. Dengan cara ini, anda dapat menggunakan simbol $ di dalam fungsi - dan di luar fungsi, masih harus menggunakan "jQuery":

$.noConflict();
jQuery(document).ready(function($){
  $("button").click(function(){
    $("p").text("jQuery masih berjalan!");
  });
});

Coba sendiri

Panduan Referensi jQuery Pusat

Untuk pandangan ringkas tentang metode jQuery pusat, silakan kunjungi Panduan Referensi jQuery Pusat