Dua penyelesaian kepada konflik prototaip jQuery (dengan muat turun sampel demo)

Dua penyelesaian kepada konflik prototaip jQuery (dengan muat turun sampel demo)_jquery

WBOY

Lepaskan： 2016-05-16 15:19:06

asal

1263 orang telah melayarinya

Artikel ini menganalisis dua penyelesaian kepada konflik prototaip jQuery dengan contoh. Kongsikan dengan semua orang untuk rujukan anda, butirannya adalah seperti berikut:

Bagaimanakah jquery dan prototaip boleh berkonflik Dalam analisis akhir, ia adalah kerana kedua-duanya menggunakan $, dan ia digunakan pada masa yang sama, yang mengelirukan. Masalah ini telah diselesaikan tidak kurang daripada 5 kali, dan saya perlu menyemaknya setiap kali. Tak sakit pun hehe.

Kaedah 1. Tambahkan kod pada fail perpustakaan teras jquery.

1. Biasanya ia adalah jquery.js, atau jquery.min.js, beberapa dengan nombor versi. Tahu sahaja fail itu.

})( window );
jQuery.noConflict(); //最后面，加上这一行。

Salin selepas log masuk

2. Muatkan fail jquery dan prototaip ujian

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/prototype/1.7.1.0/prototype.js"></script>
<script src="jquery.min.js"></script>

Salin selepas log masuk

3. Cara menulis kod js

<script type="text/javascript">
alert('prototype value : '+$('test').value); //prototype写法
jQuery(document).ready(function($){ //注意这里的，jQuery和$
  alert('jquery value : '+$('#test').val()); //jquery写法
});
</script>

Salin selepas log masuk

Disyorkan kaedah ini, kaedah ini lebih berkesan sekali dan untuk semua

Kod demo lengkap adalah seperti berikut:

<html>
<head>
<script type="text/javascript" src="./prototype.js"></script>
<script src="jquery.min.js"></script>
</head>
<body>
<form>
<input id="test" type='text' name='test' value='test'/>
</form>
<script type="text/javascript">
alert('prototype value : '+$('test').value);
jQuery(document).ready(function($){
 alert('jquery value : '+$('#test').val());
});
</script>
</body>
</html>

Salin selepas log masuk

Kaedah 2: Selesaikan konflik di mana jquery dipanggil

1. Muatkan fail jquery dan prototaip ujian

//jquery和prototype，没有先后顺序，谁先谁后都一样。
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/prototype/1.7.1.0/prototype.js"></script>

Salin selepas log masuk

2. kod js

<script type="text/javascript">
jQuery.noConflict(); //解决冲突，这个一定要放在js代码的最前面，不然就会报错了。
alert('prototype value : '+$('test').value);
jQuery(document).ready(function($){
  alert('jquery value : '+$('#test').val());
});
</script>

Salin selepas log masuk

Kaedah ini lebih sesuai untuk situasi di mana fail sumber teras jquery tidak berada pada pelayan anda sendiri, atau kod jquery agak kecil. Contoh demoKlik di sini untuk melihat.

Demo lengkap boleh klik di siniMuat turun dari tapak ini.

Saya harap artikel ini akan membantu semua orang dalam pengaturcaraan jQuery.