歡迎來到Linux教程網
Linux教程網
Linux教程網
Linux教程網
您现在的位置: Linux教程網 >> UnixLinux >  >> Linux編程 >> Linux編程

與其他庫一起使用jQuery

概要:
  在jQuery庫,幾乎所有的jQuery插件都被約束在它的命名空間裡,通常,“global”對象同樣被存儲在jQuery命名空間裡,因些不會使它與其它庫(如:Prototype, MooTools, or YUI)發生沖突。
  注意,jQuery用"$"作為它自身的默認快捷方式。
  
  "$"的功能:
  當jQuery與其它庫被加載後,你也可以不顧它的默認快捷方式而在任意一處通過調用jQuery.noConflict()函數來指定使用jQuery庫,例如:

Java代碼
  1. <html>   
  2. <head>   
  3.   <script src="prototype.js"></script>   
  4.   <script src="jquery.js"></script>   
  5.   <script>   
  6.     jQuery.noConflict();   
  7.        
  8.     // Use jQuery via jQuery(...)   
  9.     jQuery(document).ready(function(){   
  10.       jQuery("div").hide();   
  11.     });   
  12.        
  13.     // Use Prototype with $(...), etc.   
  14.     $('someid').style.display = 'none';   
  15.   </script>   
  16. </head>   
  17. <body></body>   
  18. </html> 
 
  這將使$回到它的原始庫裡,你依然可以在其它的應用程序裡使用"jQuery"。
  另外,還有其它選項。如果你想確定jQuery不會與其它庫沖突——但你又想自定義一個比較短快捷方式,你可以這麼做: Java代碼
  1. <html>   
  2. <head>   
  3.   <script src="prototype.js"></script>   
  4.   <script src="jquery.js"></script>   
  5.   <script>   
  6.     var $j = jQuery.noConflict();   
  7.        
  8.     // Use jQuery via $j(...)   
  9.     $j(document).ready(function(){   
  10.       $j("div").hide();   
  11.     });   
  12.        
  13.     // Use Prototype with $(...), etc.   
  14.     $('someid').style.display = 'none';   
  15.   </script>   
  16. </head>   
  17. <body></body>   
  18. </html>  
 

  你能夠自定義你自己的備用名稱(如:jq、$J、awesomequery——可以是任何你想要的)。
  如果你不想給jQuery自定義其它備用名稱(你更願意使用$而不管其它庫的$方法)而又不想與其它庫相沖突時,以下的解決方法最常使用的。 Java代碼
  1. <html>   
  2. <head>   
  3.   <script src="prototype.js"></script>   
  4.   <script src="jquery.js"></script>   
  5.   <script>   
  6.     jQuery.noConflict();   
  7.        
  8.     // Put all your code in your document ready area   
  9.     jQuery(document).ready(function($){   
  10.       // Do jQuery stuff using $   
  11.       $("div").hide();   
  12.     });   
  13.        
  14.     // Use Prototype with $(...), etc.   
  15.     $('someid').style.display = 'none';   
  16.   </script>   
  17. </head>   
  18. <body></body>   
  19. </html>  
 

  對於你的大部分代碼而言,這或許是最理想的方式,因為你可以以改變最少的代碼來實現完全的兼容性。

  參考:適合jQuery的快捷表示方式
  如果你不喜歡總是鍵入完整的"jQuery",有一些可供替換的快捷方式:
  重新指定jQuery為其它快捷方式 Java代碼
  1. var $j = jQuery;  
     
      如果你想使用其它不同的庫,這或許是最好的方法。
      使用下列方法,可以指定在一塊代碼內使用"$":
Java代碼 function($) { // some code that uses $ })(jQuery)  
 
  備注:如果你使用了這種方法,在這塊代碼中你將不能使用"$"來調用Prototype方法,因為你選擇了在這塊代碼中唯一使用jQuery方法。
  使用以下方法來實現DOM ready event: Java代碼
  1. jQuery(function($) { // some code that uses $ }); 

備注:同樣,在這個代碼塊裡你也還有調用Prototype方法。

Copyright © Linux教程網 All Rights Reserved