Home
PHP

Cara Mengatasi Masalah Konflik jQuery Library dan JavaScript Lainnya

Cara Mengatasi Masalah jQuery Library dan JavaScript Yang Sama Variabel
1
jQuery dengan Library JavaScript
jQuery.noConflict 
Digunakan untuk melepaskan kontrol jQuery terhadap variabel $.
  • Pemahaman
Library-library JavaScript biasanya menggunakan karakter $ sebagai fungsi ataupun variabel, nah inilah yang menjadi penyebab terjadinya konflik dengan jQuery karena jQuery juga menggunakan karakter $ sebagai alias dari kata “jQuery”.

  • Cara Mengatasi
Untuk mengatasi konflik yang terjadi maka kita bisa gunakan jQuery.noConflict.
Contoh Kasus:
  1. <script type="text/javascript" src="jquery-1.5.1.min.js"></script>   
  2. <script type="text/javascript" src="jwplayer.js"></script>  
  3.   
  4. <script type="text/javascript">  
  5.   
  6. $(document).ready(function(){  
  7.   
  8. $("#nav-1 a").click(function(){  
  9.   
  10. $(this).css({"background-color":"#88A082?,"color":"#FFF"});  
  11.   
  12. $("#nav-3 a").css({"background-color":"#FFF","color":"#000?});  
  13.   
  14. $("#nav-2 a").css({"background-color":"#FFF","color":"#000?});  
  15.   
  16. })  
  17.   
  18. })  
  19.   
  20. </script>  
Keterangan:
Dari kode diatas saya menggunakan library jwplayer.js dimana library ini mempunyai variabel dengan karakter $ sehingga terjadi konflik dengan jQuery.


  • Pertanyaan:

Bagaimana cara mengatasi konflik yang terjadi pada kode diatas sehingga saya bisa menggunakan library tersebut bersama dengan jQuery … ?
Jawaban:
  1. <script type="text/javascript" src="jquery-1.5.1.min.js"></script>   
  2. <script type="text/javascript" src="jwplayer.js"></script>  
  3.   
  4. <script type="text/javascript">  
  5.   
  6. var f=jQuery.noConflict();  
  7.   
  8. f(document).ready(function(){  
  9.   
  10. $("#nav-1 a").click(function(){  
  11.   
  12. $(this).css({"background-color":"#88A082?,"color":"#FFF"});  
  13.   
  14. $("#nav-3 a").css({"background-color":"#FFF","color":"#000?});  
  15.   
  16. $("#nav-2 a").css({"background-color":"#FFF","color":"#000?});  
  17.   
  18. })  
  19.   
  20. })  
  21.   
  22. </script>  
Keterangan:
var f=jQuery.noConflict(), Kode ini digunakan untuk merubah alias untuk jQuery dari karakter $ menjadi f.





sumber : http://a2fahmi.com/?p=16764
Penikmat Kopi dan Teh
ApradizBlog... Selamat Datang WhatsApp chat
Halo! Ada yang bisa kami bantu hari ini?
Type here...