msn email google-talk twitter tumblr flickr

jQuery冲突的安全解决办法

如果你的一个项目中同时使用到了Prototype和jQuery两个库,就会有冲突,因为他们都有使用$命名的方法.上网搜出来的中文解决方案,基本都是使用jQuery.noConflict()的.

   1  var jQuery = jQuery.noConflict();

目的很简单,将$让给别的库用.很君子的做法.不过(总是有不过 不是么),就苦了写jQuery代码的人了.每次都要输入一长串jQuery,哪怕就是使用jq来替代都要多一个字符. 而且代码也不如使用$的可读.怎么办?

我来给你一剂良药.

   1  jQuery(document).ready(function($) {
   2    // Stuff to do as soon as the DOM is ready. Use $() w/o colliding with other libs;
   3  });
   4  //Or just like this:
   5  jQuery(function($) {
   6    // Stuff to do as soon as the DOM is ready. Use $() w/o colliding with other libs;
   7  });

貌似和我们常用的ready写法没有什么区别,只在jQuery的ready参数方法中传入一个$.有啥用?简单说,就是在我们jQuery的地盘里拿回对$符的使用权.

详细点说,我们的ready方法接受的匿名函数天生就接受传入一个参数,只要有传这个参数,那它就是我们内部对jQuery方法的称呼了.对外还是jQuery的安全写法.这么说就很简单了,不是吗?:)

到这里我们可以在ready中使用$或者任何你喜欢的名字作为jQuery的别名.那么我们定义的方法中呢?难道还要使用jQuery这样的安全写法,又或者可以如法炮制?先看代码:

   1  (function($) {
   2    //Use $() w/o colliding with other libs;
   3  })(jQuery);

这是个啥玩意儿?解释一下你就明白了.function($) {}声明了一个匿名函数,函数的返回值通过外层的()括号转成了表达式.后面的(jQuery)调用了我们定义的匿名函数,传入了jQuery作实参.

试试这样定义和调用你的匿名方法:

   1  (function(foo){
   2    alert(foo);
   3  })("bar");

警报结果为bar.明白了吧?这样我们就可以随时随地的取回jQuery的$生命周期.特别适用于移植既有代码的时候,再也不用替换$为jQuery了,安全,清洁,优雅.