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() Kaedah
noConflict() melepaskan kawalan pengecam $ supaya skrip lain boleh menggunakannya.
Sudah tentu, anda masih boleh menggantikan singkatan dengan nama penuh menggunakan jQuery:
<!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("恭喜发财！");
});
});
</script>
</head>
<body>
<p>我要变身了！</p>
<button>点我有惊喜哦</button>
</body>
</html>Anda juga boleh mencipta singkatan anda sendiri. noConflict() mengembalikan rujukan kepada jQuery yang anda boleh simpan dalam pembolehubah untuk kegunaan kemudian. Lihat contoh ini:
<!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("哪来这么多惊喜，好好学习了！");
});
});
</script>
</head>
<body>
<p>我要变身了！</p>
<button>点我有惊喜哦</button>
</body>
</html>Jika blok kod jQuery anda menggunakan trengkas $, 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":
<!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("学习要努力，持之以恒！");
});
});
</script>
</head>
<body>
<p>真的有惊喜，试试</p>
<button>点我点我</button>
</body>
</html>
bahagian seterusnya