首页 | 源码下载 | 网站模板 | 网页特效 | 广告代码 | 网页素材 | 字体下载 | 书库 | 站长工具
会员投稿 投稿指南 RSS订阅
当前位置:主页>网络编程>ajax教程>资讯: Ajax学习:与其他库一起使用jQuery

Ajax学习:与其他库一起使用jQuery

www.jz123.cn  2009-10-27   来源:   中国建站    责任编辑(袁袁)    我要投递新闻

  概要:

  在jQuery库,几乎所有的jQuery插件都被约束在它的命名空间里,通常,“global”对象同样被存储在jQuery命名空间里,因些不会使它与其它库(如:Prototype, MooTools, or YUI)发生冲突。

  注意,jQuery用"$"作为它自身的默认快捷方式。

  "$"的功能:

  当jQuery与其它库被加载后,你也可以不顾它的默认快捷方式而在任意一处通过调用jQuery.noConflict()函数来指定使用jQuery库,例如:

  <html> <head> <script src="prototype.js"></script> <script src="jquery.js"></script> <script> jQuery.noConflict(); // Use jQuery via jQuery(...) jQuery(document).ready(function(){ jQuery("div").hide(); }); // Use Prototype with $(...), etc. $('someid').style.display = 'none'; </script> </head> <body></body> </html>

  这将使$回到它的原始库里,你依然可以在其它的应用程序里使用"jQuery"。

  另外,还有其它选项。如果你想确定jQuery不会与其它库冲突——但你又想自定义一个比较短快捷方式,你可以这么做:

  <html> <head> <script src="prototype.js"></script> <script src="jquery.js"></script> <script> var $j = jQuery.noConflict(); // Use jQuery via $j(...) $j(document).ready(function(){ $j("div").hide(); }); // Use Prototype with $(...), etc. $('someid').style.display = 'none'; </script> </head> <body></body> </html>

  你能够自定义你自己的备用名称(如:jq、$J、awesomequery——可以是任何你想要的)。

  如果你不想给jQuery自定义其它备用名称(你更愿意使用$而不管其它库的$方法)而又不想与其它库相冲突时,以下的解决方法最常使用的。

  <html> <head> <script src="prototype.js"></script> <script src="jquery.js"></script> <script> jQuery.noConflict(); // Put all your code in your document ready area jQuery(document).ready(function($){ // Do jQuery stuff using $ $("div").hide(); }); // Use Prototype with $(...), etc. $('someid').style.display = 'none'; </script> </head> <body></body> </html>

  对于你的大部分代码而言,这或许是最理想的方式,因为你可以以改变最少的代码来实现完全的兼容性。

  参考:适合jQuery的快捷表示方式

  如果你不喜欢总是键入完整的"jQuery",有一些可供替换的快捷方式:

  重新指定jQuery为其它快捷方式

  var $j = jQuery;

  如果你想使用其它不同的库,这或许是最好的方法。

  使用下列方法,可以指定在一块代码内使用"$":

  function($) { // some code that uses $ })(jQuery)

  备注:如果你使用了这种方法,在这块代码中你将不能使用"$"来调用Prototype方法,因为你选择了在这块代码中唯一使用jQuery方法。

  使用以下方法来实现DOM ready event:

  jQuery(function($) { // some code that uses $ });

  备注:同样,在这个代码块里你也还有调用Prototype方法。


上一篇:AJAX教程第一章—初识AJAX 下一篇:JQuery教程:获取网页表单值的方法

评论总数:1 [ 查看全部 ] 网友评论


关于我们隐私版权广告服务友情链接联系我们网站地图