Home Using jQuery with Other Libraries

Sử dụng jQuery với các thư viện JavaScript khác

Wednesday, 15 April 2009 15:48 Anhxtanh3087
E-mail Print PDF
User Rating: / 10
PoorBest 

(PHP Code Vn Group) - Thư viện jQuery và hầu hết các plugin của nó đều bắt buộc sử dụng không gian tên của jQuery. Chính vì thế mà nếu bạn sử dụng các thư viện khác như: Prototype, MooTools, YUI trong trang web của bạn thì có thể gây xung đột không gian tên với các thư viện này!

 Mặc định thì jQuery sử dụng $ thay cho jQuery (cả 2 cách đều ok) .

 

Ghi đè hàm $() :

Tuy nhiên, bạn có thể ghi đè hàm $ bằng cách gọi hàm jQuery.noConflict() tại bất kỳ nơi nào mà jQuery và các thư viện khác được tải xong. VD:

 

  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').hide();
  15.    </script>
  16.  </head>
  17.  <body></body>
  18.  </html>
 
 

 hoặc cách hay hơn:

  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').hide();
  15.    </script>
  16.  </head>
  17.  <body></body>
  18.  </html>
 
 

Cuối cùng, nếu bạn không muốn định nghĩa lại hàm $ thì vẫn còn 1 giải pháp nữa, và có lẽ là cách hay nhất:

  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').hide();
  16.    </script>
  17.  </head>
  18.  <body></body>
  19.  </html>
 
 

đặt code sử dụng jQuery trong vùng mà được thực thi khi tài liệu HTML của bạn sẵn sàng (được tải xong) . Còn code sử dụng Prototype thì sẽ được xử lý trước đó.

 Include jQuery trước các thư viện khác:

Khi đó không cần gọi hàm jQuery.noConflict() nữa. VD:

  1. <html>
  2.  <head>
  3.    <script src="jquery.js"></script>
  4.    <script src="prototype.js"></script>
  5.    <script>
  6.      // Use jQuery via jQuery(...)
  7.      jQuery(document).ready(function(){
  8.        jQuery("div").hide();
  9.      });
  10.      
  11.      // Use Prototype with $(...), etc.
  12.      $('someid').hide();
  13.    </script>
  14.  </head>
  15.  <body></body>
  16.  </html>
 
 

Tài liệu tham khảo: http://docs.jquery.com/Using_jQuery_with_Other_Libraries

Next >
Last Updated ( Wednesday, 15 April 2009 16:15 )  

Đề cử phpLemon

POLLS

Bạn thích sử dụng JavaScript Framework nào nhất?
 

Alexa Rank


Who's Online

We have 2 guests online