解决jquery中美元符号命名冲突问题

2024-12-08 07:22:54

在Jquery中，$是JQuery的别名，所有使用$的地方也都可以使用JQuery来替换，如$('#msg')等同于JQuery('#msg') 的写法。然而，当我们引入多个js库后，在另外一个js库中也定义了$符号的话，那么我们在使用$符号时就发生了冲突。下面以引入两个库文件 jquery.js和prototype.js为例来进行说明。

第一种情况：jquery.js在prototype.js之后进行引入,如： <</span> script src = " prototype.js " type = " text/javascript " />
<</span> script src = " jquery.js " type = " text/javascript " />
在这种情况下,我们在自己的js代码中如下写的话：
$( ' #msg ' ).hide();
$永远代表的是jquery中定义的$符号，也可以写成JQuery('#msg').hide();如果想要使用prototype.js中定义的$,我们在后面再介绍。

第二种情况：jquery.js在prototype.js之前进行引入,如： <</span> script src = " jquery.js " type = " text/javascript " />
<</span> script src = " prototype.js " type = " text/javascript " />
在这种情况下,我们在自己的js代码中如下写的话：
$( ' #msg ' ).hide();
$此时代表的prototype.js中定义的$符号，如果我们想要调用jquery.js中的工厂选择函数功能的话，只能用全称写法JQuery('#msg').hide().

下面先介绍在第一种引入js库文件顺序的情况下，如何正确的使用不同的js库中定义的$符号。

一.使用JQuery.noConflict()
该方法的作用就是让Jquery放弃对$的所有权，将$的控制权交还给prototype.js,因为jquery.js是后引入的，所以最后拥有$控制权的是jquery。它的返回值是JQuery。当在代码中调用了该方法以后，我们就不可以使用$来调用jquery的方法了，此时$就代表在prototype.js库中定义的$了。如下： JQuery.noConflict();
// 此处不可以再写成$('#msg').hide(),此时的$代表prototype.js中定义的$符号。
JQuey( ' #msg ' ).hide();
自此以后$就代表prototype.js中定义的$,jquery.js中的$无法再使用,只能使用jquery.js中$的全称JQuery了。

二.自定义JQuery的别名
如果觉得第一种方法中使用了JQuery.noConflict()方法以后,只能使用JQuery全称比较麻烦的话，我们还可以为JQuery重定义别名。如下：
var $j = JQuery.noConflict();
$j( ' #msg ' ).hide(); // 此处$j就代表JQuery
自此以后$就代表prototype.js中定义的$,jquey.js中的$无法再使用,只能使用$j来作为jquey.js中JQuery的别名了。

三.使用语句块，在语句块中仍然使用jquery.js中定义的$，如下：
JQuery.noConflict();
JQuery(document).ready(function($){ $( ' #msg ' ).hide(); // 此时在整个ready事件的方法中使用的$都是jquery.js中定义的$. }); 或者使用如下语句块：
(function($){ $( ' #msg ' ).hide(); // 此时在这个语句块中使用的都是jquery.js中定义的$. })(JQuery)
如果在第二种引入js库文件顺序的情况下,如何使用jquery.js中的$,我们还是可以使用上面介绍的语句块的方法，如：
<</span> script src = " jquery.js " type = " text/javascript " />
<</span> script src = " prototype.js " type = " text/javascript " />
<</span> script type = " text/javascript " >
(function($){ $( ' #msg ' ).hide(); // 此时在这个语句块中使用的都是jquery.js中定义的$. })(JQuery)
</</span> script >
这种使用语句块的方法非常有用，在我们自己写jquery插件时,应该都使用这种写法，因为我们不知道具体工作过程中是如何顺序引入各种js库的,而这种语句块的写法却能屏蔽冲突。

ps ：jquery中特殊字符的含义：
#　　指示　id　
.　　指示　class　
*　　全选　
,　　多选　
空格　后代　
>　　子　
~　　兄弟　
+　　下一个　
:　　子(多功能)　
()　　函数式的过滤与查找

jQuery$命名冲突怎么办如何解决

其他一些 JavaScript 框架包括:MooTools.Backbone.Sammy.Cappuccino.Knockout.JavaScript MVC.Google Web Toolkit.Google Closure.Ember.Batman 以及 Ext JS. 其中某些框架也使用 $ 符号作为简写(就像 jQuery),如果您在用的两种不同的框架正在使用相同的简写符号,有可能导致脚本停止运行. jQuery 的团队考虑到了这个问题,并实现了 noConflict() 方法. 实例
JQuery的$命名冲突详细解析

在Jquery中,$是JQuery的别名,所有使用$的地方也都可以使用JQuery来替换,如$('#msg')等同于JQuery('#msg')的写法.然而,当我们引入多个js库后,在另外一个js库中也定义了$符号的话,那么我们在使用$符号时就发生了冲突.下面以引入两个库文件jquery.js和prototype.js为例来进行说明. 第一种情况:jquery.js在prototype.js之后进行引入,如:<script src="prototype.js" type=&quo
Jquery命名冲突解决的五种方案分享

因为许多 JavaScript 库使用 $ 作为函数或变量名,jquery也一样.其实$只是jquery的一个别名而已,假如我们需要使用 jquery 之外的另一 js 库,我们可以通过调用 $.noConflict() 向该库返回控制权.下面是收集到解决这一问题的五种方案,总有一种你会用得上的. 例一: 复制代码代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://w
jQuery $命名冲突解决方案汇总

最近遇到个问题,同时引用了jquery库和另外一个js库.当用$XX去调用js库函数时,发现失效了!于是找资料,原来是jquery命名冲突了.因为许多JavaScript 库使用$作为函数或变量名,jquery也一样.其实$只是jquery的一个别名而已,假如我们需要使用jquery 之外的另一js库,我们可以通过调用 $.noConflict() 向该库返回控制权.下面是收集到解决这一问题的五种方案,总有一种你会用得上的. 例一: 复制代码代码如下: <!DOCTYPE html PUBLI
如何解决Jquery库及其他库之间的$命名冲突

首先我们应该知道,在jquery中,$(美元符号)就是jquery的别名,也就是说使用$和使用jquery是一样的,在很多时候我们命名空间时,正是因为这个$而产生的冲突的发生.比如说:$('#xmlas')和JQuery('#xmlas') 虽然在写法上不同,但在实际上却是完全等同的. 要想解决这个冲突,其实最简单的方法就是使用不同的名称来命名,或者让执行代码认为是不同的命名空间即可. 一. jQuery库在其他库之前导入,直接使用jQuery(callback)方法如: 复制代码代码如下:
解决jquery中美元符号命名冲突问题

在Jquery中,$是JQuery的别名,所有使用$的地方也都可以使用JQuery来替换,如$('#msg')等同于JQuery('#msg') 的写法.然而,当我们引入多个js库后,在另外一个js库中也定义了$符号的话,那么我们在使用$符号时就发生了冲突.下面以引入两个库文件 jquery.js和prototype.js为例来进行说明. 第一种情况:jquery.js在prototype.js之后进行引入,如: <</span> script src = " prototyp
prototype框架中美元符号$用法分析

本文实例讲述了prototype框架中美元符号$用法.分享给大家供大家参考,具体如下: prototype是实现面向对象的一个重要工具,是javascript的一个不错的框架. 用jquery的人都知道,jquery中也有$美元符号,prototype中呢,也有$,他们有什么区别呢. 1.prototype中$()的用法 prototype写法 $("test") 或者 $$("#test"), 他相当于js中document.getElementById(&quo
解决jquery中动态新增的元素节点无法触发事件问题的两种方法

比如做一个ajax读取留言列表的时候,每条留言后面有个回复按钮,class为"reply",如果你用的是$(".reply").click(function(){ //do something... }),想必后面通过ajax加载进来的列表中的回复按钮,点击事件会失效. 其实最简单的方法就是直接在标签中写onclick="",但是这样写其实是有点low的,最好的方式还是通过给类名绑定一个click事件. 解决jquery中动态新增的元素节点无法触
详解闭包解决jQuery中AJAX的外部变量问题

详解闭包解决jQuery中AJAX的外部变量问题在AJAX中,我们经常都要使用外部变量,经常会多次使用,如下代码 function getCarInfo(){ for(var i=0;i<4;i++){ var carId = $("#carList0"+i+" #carId").val(); var request = { city: city, carId: carId }; $.ajax({ url:"enquiry", type:
jQuery解决$符号命名冲突

前些天朋友让我帮他解决一个页面中jquery特效的兼容性问题,觉得这是一个很容易忽略也很重要的一点,特在此记录一下. 朋友给的页面中用到了三个特效,其中两个特效可以显示,第三个没有效果.通过查看引用的js文件,我发现页面中不光引入了jquery.js,还引入了一个名为prototype.js的文件. 这个prototype.js之前未曾听说过,特意在百度上搜了一下,原来它也是一个js类库,功能和jquery差不多,而且很强大. 通过一点点的排查,我发现那两个可以显示的特效引用的是jquery,而
JQuery中的ready函数冲突的解决方法

一个aspx页面通常可以包含其它ascx控件,如果在多人协同开发的情况下:程序员小张在控件A.ascx中使用了 $().ready(function{}),而程序员小王又在控件B.ascx中也使用了ready函数,程序员小李在做页面时,把A.ascx,B.ascx都拖到自己的页面中,然后在页面中也需要用到$().ready函数,这下好了: 虽然jQuery本身的设计还算不错,document加载完成后会依次触发各个ready中定义的function(这一点很好,不象javascript中默认后面
php中$美元符号与Zen Coding冲突问题解决方法分享

Zen Coding插件就不多做介绍了. 众所周知,安装了插件以后,输入$符号会被自动解析为相应的数字1.2.3... 作为一名PHP程序员,想要通过其定义一些自己常用的代码.却发现展开以后悲剧的发现$符号全变成了数字. 下面教你解决方法:
解决Mybatis中mapper的ID冲突问题

mapper 的id冲突原因: 原因一: 在同一个mapper.xml中存在相同的ID 原因二: 同时使用了xml配置和注解配置解决方案: 只保留xml或者注解即可!!! Mybatis mapper文件下同一id 查询结果列不同问题场景描述: 订单数据按天分表,正常情况下每一天的表结构都是一样的,表名命名格式order_yyyyMMdd. 定义一个查询如下: <select id="orderSelect" parameterClass="java.util.Ha
解决mybatis中的mapper命名问题

mybatis mapper命名问题 mapper文件中id命名最好首字母小写,避免让mybatis认为是一个类  <resultMap id="ProviderList" type="Provider"> <result property="id" column="id"/> <result property="proCode" col
解决jQuery插件tipswindown与hintbox冲突

使用情形如下: 页面a.aspx中点击按钮弹出模拟层,在这个层中有一个输入文本框"监督人"处调用hintbox来产生即时查询功能. 直接调用产生了如下情形: 于是找到jquery.hintbox-1.3.js这个文件,发现其中出现这么一行: 复制代码代码如下: $("#windown-content").ajaxStart(function(){ $(this).html("<img src='"+templateSrc+"/i

解决jquery中美元符号命名冲突问题

相关推荐

随机推荐