jQuery noConflict() kaedah


kaedah jQuery - noConflict()


Bagaimana untuk menggunakan jQuery dan rangka kerja lain pada masa yang sama pada halaman?


jQuery dan rangka kerja JavaScript lain

Seperti yang anda sedia maklum, jQuery menggunakan tanda $ sebagai Singkatan untuk jQuery.

Bagaimana jika rangka kerja JavaScript lain turut menggunakan simbol $ sebagai trengkas?

Beberapa rangka kerja JavaScript lain termasuk: MooTools, Backbone, Sammy, Cappuccino, Kalah Mati, JavaScript MVC, Google Web Toolkit, Google Closure, Ember, Batman dan Ext JS.

Sesetengah rangka kerja ini juga menggunakan simbol $ sebagai trengkas (sama seperti jQuery Jika anda menggunakan dua rangka kerja berbeza yang menggunakan simbol trengkas yang sama, ia mungkin menyebabkan skrip berhenti berjalan).

Pasukan jQuery mengambil kira isu ini dan melaksanakan kaedah noConflict().


kaedah jQuery noConflict()

noConflict() Kaedah ini melepaskan kawalan pengecam $ supaya skrip lain boleh menggunakannya.

Sudah tentu, anda masih boleh menggunakan jQuery dengan menggantikan singkatan dengan nama penuh:

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">
</script>
<script>
$.noConflict();
jQuery(document).ready(function(){
  jQuery("button").click(function(){
    jQuery("p").text("jQuery 仍然在工作!");
  });
});
</script>
</head>

<body>
<p>这是一个段落。</p>
<button>点我</button>
</body>
</html>

Jalankan instance »

Klik butang "Run Instance" untuk melihat contoh dalam talian

Anda juga boleh mencipta singkatan anda sendiri. noConflict() mengembalikan rujukan kepada jQuery yang anda boleh simpan dalam pembolehubah untuk kegunaan kemudian. Sila lihat contoh ini:

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">
</script>
<script>
var jq=$.noConflict();
jq(document).ready(function(){
  jq("button").click(function(){
    jq("p").text("jQuery 仍然在工作!");
  });
});
</script>
</head>

<body>
<p>这是一个段落。</p>
<button>点我</button>
</body>
</html>

Run Instance»

Klik butang "Run Instance" untuk melihat contoh dalam talian

Jika blok kod jQuery anda menggunakan singkatan $ dan anda tidak mahu menukar pintasan ini, anda boleh menghantar simbol $ sebagai pembolehubah kepada kaedah sedia. Dengan cara ini anda boleh menggunakan simbol $ di dalam fungsi - tetapi di luar fungsi, anda masih perlu menggunakan "jQuery":

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">
</script>
<script>
$.noConflict();
jQuery(document).ready(function($){
  $("button").click(function(){
    $("p").text("jQuery 仍然在工作!");
  });
});
</script>
</head>

<body>
<p>这是一个段落。</p>
<button>点我</button>
</body>
</html>

Jalankan Instance»

Klik butang "Run Instance" untuk melihat contoh dalam talian