Jquery库及其他库之间的$命名冲突解决办法
首先我们应该知道,在jquery中,$(美元符号)就是jquery的别名,也就是说使用$和使用jquery是一样的,在很多时候我们命名空间时,正是因为这个$而产生的冲突的发生。比如说:$('#xmlas')和JQuery('#xmlas') 虽然在写法上不同,但在实际上却是完全等同的。
要想解决这个冲突,其实最简单的方法就是使用不同的名称来命名,或者让执行代码认为是不同的命名空间即可。
一、 jQuery库在其他库之前导入,直接使用jQuery(callback)方法如:
代码如下 | 复制代码 |
<html> <script type="text/javascript"> $("pp").style.display = 'none'; //使用prototype |
二、jQuery库在其他库之后导入,使用jQuery.noConflict()方法将变量$的控制权让渡给其他库,有以下几种方式:
代码如下 | 复制代码 |
<script type="text/javascript"> $("pp").style.display = 'none'; //使用prototype |
//代码二
代码如下 | 复制代码 |
<script type="text/javascript"> $("pp").style.display = 'none'; //使用prototype |
码三
代码如下 | 复制代码 |
<script type="text/javascript"> $("pp").style.display = 'none'; //使用prototype |
//代//代码四
代码如下 | 复制代码 |
<script type="text/javascript"> $("pp").style.display = 'none'; //使用prototype /*********************************************************************/ |
除了上面的方法之外,我们还可以采用第二种方法来解决冲突的问题,那就是最笨但最有效的解决方法:用自定义的命名空间来避免冲突。
比如说需要的项目名称为xmlas,那么我们原来的代码:
代码如下 | 复制代码 |
$('contentArea').show() |
就可以写成以下这种形式:
代码如下 | 复制代码 |
XMLAS('contentArea').show() |
3.在jquery代码中,当遇到冲突的时候我们可以使用$符号,这需要我们在ready事件中添上以下代码:
代码如下 | 复制代码 |
jQuery(document).ready(function($) { |
当然,您也可以简写成下面的形式:
代码如下 | 复制代码 |
jQuery(function($){ //这里为使用$的代码 }); |
由此,根据第一个方法来实现的完整代码如下:
代码如下 | 复制代码 |
//jquery库与其他库冲突的完整解决办法 <script type="text/javascript" src="photolist.js"></script> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> $.noConflict(); jQuery(function($) { //使用了$的jquery代码 }); //这里是你的其他js库代码 </script> |
当然,你也可以对上面的完整代码进行一步的简化,简化代码如下:
代码如下 | 复制代码 |
//简化后的代码 |
jQuery$命名冲突问题解决方法
解决JQuery中美元符号($)与$命名冲突
解决JQuery中$与JS插件库相冲突问题
jquery ajax 表单提交被浏览器拦截解决办法
jQuery中$.getJSON乱码问题解决办法
jquery ajax.getscript缓存问题解决办法
JQuery ui dialog(close)无效的解决办法
jQuery绑定和解绑点击事件及重复绑定解决办法
JQuery TypeError: this.parentNode is undefined解决办法
jquery中click与dblclick事件冲突解决方法
jquery (document).ready中使用document.write导致页面空白解决办法
jquery IE6 select.val() bug报错解决办法
相关文章
- jQuery显示隐藏密码插件jquery.toggle-password演示
- jQuery分页插件(jquery.page.js)的使用
- [JQuery] jQuery选择器ID、CLASS、标签获取对象值、属性、设置css样式
- JQuery Mobile+ iscroll 列表滚动条的实现
- jQuery Custom Selector JQuery自定义选择器
- jQuery下实现检测指定元素加载完毕
- jQuery中的.bind()、.live()和.delegate()之间区别分析
- jQuery.noConfilct()
- 直接在UI5里使用jQuery, 而不是oData API去绑定模型
- python web py入门(62)- jQuery - 判断文本框输入内容是否发生改变
- axios替换jquery的ajax