JavaWeb 第7章 JQuery 的 Ajax 交互扩展 任务5：掌握 jQuery 让渡 "$" 操作符的方法

JavaWeb 应用设计及实战 目录

上一章   下一章

上一个任务/上一节       下一个任务/下一节

目录

任务5：掌握 jQuery 让渡 "$" 操作符的方法

    示例 13

    示例 14 

---

任务5：掌握 jQuery 让渡 "$" 操作符的方法

     在 jQuery 中，"$"符号有着重要的作用。除了 jQuery ，还有其他以一些 JavaScript 

脚本库也使用了 "$" 符号，当项目开发中因为某些原因同时使用了 jQuery 和另一个同

样使用 "$" 符号的脚本库，就会产生冲突。在以下代码中，Prototype 库的 "$" 符号

会覆盖 jQuery 的 "$" 符号。

<script type = "text/javascript" src = "../js/jquery-1.12.4.min.js">
<script type = "text/javascript" src = "../js/prototype.js">

而以下代码中，jQuery 的 "$"符号会覆盖 Prototype 库的 "$" 符号。

<script type = "text/javascript" src = "../js/prototype.js"/>
<script type = "text/javascript" src = "../js/jquery-1.12.4.min.js">

     为了使 jQuery 能够与其他同样使用 "$"符号的脚本库协同工作，jQuery 定义了

jQuery.noConflict() 方法，放弃了对 "$" 符号的使用权，并可以通过返回值指定一个

替代符号，如示例 13 所示。

    示例 13

jQuery.noConflict(); //让渡 "$" 的使用权，后续 jQuery 代码中只能使用 jQuery 代替 $
jQuery("/#show").click(…);

或者重新指定一个替代的符号：

var $j = jQuery.noConflict(); //让渡 "$" 的使用权，并指定用 "$j" 代替 "$"
$j("#show").click(…);

   但是无论采用哪种方式，都会改变 jQuery 的编码风格，不仅更加繁琐，而且对于

已有 jQuery 代码的重用也会产生不利影响。

    为了在解决冲突的同时尽量减少对 jQuery 代码的影响，建议使用如示例 14 所示的

处理方法。

    示例 14 

jQuery.noConflict();//让渡 "$" 的使用权，其他脚本库可以使用 "$"
jQuery(document).ready(function($)){
    //在此代码块中可以继续使用 "$" 编写 jQuery 代码
    ……//省略其他代码
});

或者

jQuery.noConflict();//让渡 "$" 的使用权，其他脚本库可以使用 "$"
(function($)){
    //在此代码块中可以继续使用 "$" 编写 jQuery 代码
    $(document).ready(function()){
        ……//省略其他代码
    });
})(jQuery);