注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

梦幻雪冰

技在手,能在身,思在脑,从容过生活——陈能堡

 
 
 

日志

 
 

【转载】解决jQuery库与其他JS库的冲突  

2014-08-05 22:33:27|  分类: JavaScript |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |
jQuery库中,几乎所有的插件都被限制在他的命名空间里。通常全局对象都被很好地存储在命名空间里,一次在和其他库一起使用时,一般不会引起冲突。
    虽然其他库与jQuery库一般不会发生冲突,但由于"$"是jQuery自身的快捷符,而其他JS库中也含有"$"符,如果多库共存,那么,就存在是哪个库使用"$"符的问题,为了解决这个问题,在jQuery中,可以通过函数jQuery.noConfliet(),将变量"$"的使用权过渡给需要使用的其他JS库,其调用的语法格式为:
    jQuery.neConflict()
    这个函数的作用是变更"$"变量的使用权,以确定jQuery库不与其他库相冲突,使用权变更后,就只能使用jQuery变量访问jQuery对象.
    虽然通过函数jQuery.noConfliet()可以很好地解决多库共存时变量符"$"的使用权问题,但在实际的应有中,又分为jQuery在其他库前导入与在其他库后导入两种情况.
一、jQuery库与在其他库之后引入;
在其他库和jQuery库都被加载完毕后,可以在任何时候调用jQuery.noConflict()函数来将变量$控制权交给其他JS库
demo

<body>
<p id="pp">Test-prototype(将被隐藏)</p>
<p >Test-jQuery(将被绑定单击事件)</p>
</body>
<script src="prototype.js" type="text/javascript"></script>
<script src="jquery.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery.noConflict(); //将变量$的控制权让渡给prototype.js
jQuery(function(){ //使用jQuery
jQuery("p").click(function(){
alert( jQuery(this).text() );
});
});
$("pp").style.display = 'none'; //使用prototype.js隐藏元素
</script>

此外还有另一种选择。自定义一个快捷方式。

<script src="prototype.js" type="text/javascript"></script>
<script src="scripts/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
/*自定义一个比较短快捷方式*/
var $j = jQuery.noConflict();
/*使用jQuery*/
$j(function(){
$j("p").click(function(){
alert( $j(this).text() );
});
});
/*使用prototype.js隐藏元素*/
$("pp").style.display = 'none';
</script>

二、jQuery库在其他库之前导入
那么可以直接使用jQuery来做一些jQuery的工作,同时也可以使用$()作为其他库的快捷方式,这里无需调用用jQuery.noConflict()

<script src="scripts/jquery.js" type="text/javascript"></script>
<script src="prototype.js" type="text/javascript"></script>
<script type="text/javascript">
/*直接使用 jQuery ,没有必要调用"jQuery.noConflict()"函数。*/
jQuery(function(){
jQuery("p").click(function(){
alert( jQuery(this).text() );
});
});
$("pp").style.display = 'none'; //使用prototype
</script>





  评论这张
 
阅读(78)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017