我如何实现JQuery.noConflict()？

Question

我在同一个html页面上使用javascript和jquery代码.出于某种原因,jQuery库阻止我的本机javascript代码正常工作.

我找到了这个页面:jQuery No Conflict 说你可以使用jquery.noConflict将$释放回javascript.但是,我不知道该怎么做？

具体来说,我不确定如何正确实现这一点？Jquery代码在哪里,JS代码在哪里？

我的代码如下:

<script type="text/javascript">
  $.noConflict();
  // Code that uses other library's $ can follow here.
</script>

Answer 1

jQuery.noConflict将重置$变量,使其不再是别名jQuery.除了只召唤一次,你真的不需要做太多其他事情.但是,如果您愿意,可以使用返回值创建自己的别名:

var jq = jQuery.noConflict();

而且,通常,您希望在包含jQuery和任何插件后立即执行此操作:

<script type="text/javascript" src="/path/to/jquery.js"></script>
<script type="text/javascript" src="/path/to/jquery-plugin.js"></script>
<script type="text/javascript">
  jQuery.noConflict();
  // Code that uses other library's $ can follow here.
</script>
<script type="text/javascript" src="/path/to/prototype.js"></script>

你也可以去一步,腾出jQuery用noConflict(true).但是,如果你采取这种方式,你肯定会想要一个别名,既不是$也jQuery不可能是你想要的:

var jq = jQuery.noConflict(true);

我想,这最后一个选项主要是用于混合的jQuery的版本,特别是过时的插件,当你想更新jQuery的本身:

<script type="text/javascript" src="jquery-1.4.4.js"></script>
<script type="text/javascript" src="jquery-older-plugin.js"></script>
<script type="text/javascript">
    var jq144 = jQuery.noConflict(true);
</script>
<script type="text/javascript" src="jquery-1.6.4.js"></script>
<script type="text/javascript" src="jquery-newer-plugin.js"></script>

Answer 2

默认情况下,jquery使用变量jQuery,$用于方便您使用.如果你想避免冲突,一个好方法是封装jQuery,如下所示:

(function($){

    $(function(){

        alert('$ is safe!');

    });

})(jQuery)