锋利的jQuery-1--解决jquery库和其他库的冲突
在jquery中,$(美元符号)就是jquery的别名,也就是说使用$和使用jquery是一样的,在很多时候我们命名空间时,正是因为这 个$而产生的冲突的发生。比如说:$('#xmlas')和JQuery('#xmlas') 虽然在写法上不同,但在实际上却是完全等同的。
要想解决这个冲突,其实最简单的方法就是使用不同的名称来命名,或者让执行代码认为是不同的命名空间即可。
一、jQuery库在其他库之后导入,使用jQuery.noConflict()方法将变量$的控制权让渡给其他库,有以下几种方式:
1.使用jQuery代替$
<script type="text/javascript">
jQuery.noConflict(); //将变量$的控制权让渡给prototype.js
jQuery(function(){ //使用jQuery
jQuery("p").click(function(){
alert( jQuery(this).text() );
});
});
$("pp").style.display = 'none'; //使用prototype
</script>
2.定义$的别名
<script type="text/javascript">
var $j = jQuery.noConflict(); //自定义一个比较短快捷方式
$j(function(){ //使用jQuery
$j("p").click(function(){
alert( $j(this).text() );
});
});
$("pp").style.display = 'none'; //使用prototype
</script>
3.使用jquery自动加载的方式
<script type="text/javascript">
jQuery.noConflict(); //将变量$的控制权让渡给prototype.js
jQuery(function($){ //使用jQuery
$("p").click(function(){ //继续使用 $ 方法
alert( $(this).text() );
});
});
$("pp").style.display = 'none'; //使用prototype
</script> 或者 <script type="text/javascript">
jQuery.noConflict(); //将变量$的控制权让渡给prototype.js
(function($){ //定义匿名函数并设置形参为$
$(function(){ //匿名函数内部的$均为jQuery
$("p").click(function(){ //继续使用 $ 方法
alert($(this).text());
});
});
})(jQuery); //执行匿名函数且传递实参jQuery
$("pp").style.display = 'none'; //使用prototype
/*********************************************************************/
jQuery(document).ready(function(){ //一加载页面的时候就将权利让出去
jQuery.noConflict();
});
</script>
二、 jQuery库在其他库之前导入,直接使用jQuery(callback)方法如:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!--先导入jQuery -->
<script src="../../scripts/jquery-1.3.1.js" type="text/javascript"></script>
<!--后导入其他库 -->
<script src="prototype-1.6.0.3.js" type="text/javascript"></script>
</head>
<body>
<p id="pp">test---prototype
<p >test---jQuery
<script type="text/javascript">
jQuery(function(){ //直接使用 jQuery ,没有必要调用"jQuery.noConflict()"函数。
jQuery("p").click(function(){
alert( jQuery(this).text() );
});
});
$("pp").style.display = 'none'; //使用prototype
</script>
</body>
</html>
锋利的jQuery-1--解决jquery库和其他库的冲突的更多相关文章
- 解决jQuery多个版本,与其他js库冲突方法
jQuery多个版本或和其他js库冲突主要是常用的$符号的问题,这个问题 jquery早早就有给我们预留处理方法了,下面一起来看看解决办法. 1.同一页面jQuery多个版本或冲突解决方法. < ...
- Jquery库及其他库之间的$命名冲突解决办法
首先我们应该知道,在jquery中,$(美元符号)就是jquery的别名,也就是说使用$和使用jquery是一样的,在很多时候我们命名空间时,正是因为这个$而产生的冲突的发生.比如说:$('#xmla ...
- 解决jQuery和其他库冲突
<script> console.log($); // //jquery在其他库之前导入,直接使用jQuery()或 // var $replace = jQuery.noConflict ...
- 解决jquery与zepto等其它库冲突兼容的问题
解决jquery与zepto等其它库冲突兼容的问题;(function ($) { }) (jQuery); ;(function ($) { }) (Zepto); 在Bootstrap ...
- (五)解决jQuery和其它库的冲突
在jQuery库中,几乎所有的插件都被限制在它的命名空间里.全局的对象都很好地存储在jQuery命名空间里,因此当把jQuery和其它javascript类库一起使用时,不会引起冲突.(注意:默认情况 ...
- jquery库与其他库(比如prototype)冲突的解决方法
前端开发很容易会遇到jQuery库与其他库冲突的场景,比如和prototype库冲突. 实际上这种冲突是因为不同的第三方JS库争夺对$标识符的控制权引起的. 解决方法,就是使用jQuery提供的jQu ...
- 解决jQuery中美元符号($)命名与别的js脚本库引用冲突方法
在Jquery中,$是JQuery的别名,所有使用$的地方也都可以使用JQuery来替换,如$('#msg')等同于JQuery('#msg') 的写法.然而,当我们引入多个js库后,在另外一个js库 ...
- 如何解决jquery库的冲突问题
多个库之间的冲突 当一个项目中引入多个第三方库的时候,由于没有命名空间的约束(命名空间就好比同一个目录下的文件夹一样,名字相同就会产生冲突),库与库之间发生冲突在所难免. 那么,既然有冲突的问题,为什 ...
- 完美解决jQuery符号$与其他javascript 库、框架冲突的问题
目前有大量的 javascript 开发框架,其中有一部分使用 $ 作为调用符号,这可能导致相互之间的冲突,而 jQuery 为解决这个问题,可以在 jQuery 导入时放弃 $ 使用权,届时 $ 则 ...
随机推荐
- 修改Tomcat可支持get形式url长度
maxHttpHeaderSize="8192" 加在 <Connector port="8081" maxHttpHeaderSize="31 ...
- 配置错误定义了重复的“system.web.extensions/scripting/scriptResourceHandler” 解决办法
今天遇到了这个问题, 电脑系统:vs2010 win7系统 iis7 我运行在iis中配置的那个网站后,报错:错误代码 0x800700b7 配置错误定义了重复的“system.web.extensi ...
- DDD 领域驱动设计-谈谈 Repository、IUnitOfWork 和 IDbContext 的实践(转)
http://www.cnblogs.com/xishuai/p/ddd-repository-iunitofwork-and-idbcontext.html 好久没写 DDD 领域驱动设计相关的文章 ...
- 从客户端中检测到有潜在危险的request.form值
今天被这个问题卡住了,在用到CKEDITOR的时候,老是报错显示输入字符存在潜在危险,之后百度了一下,试了这两种方法: 解决方案一: 在.aspx文件头中加入这句: <%@ Page ...
- 动画:UIKitAnimation 简单动画学习 iOS (一) 渐变 、 移动 、翻页、来回翻转 ——转载
转载请说明(谢谢) http://blog.csdn.net/a21064346/article/details/7851695 点击打开链接 以下 一个系列的 动画效果 在 UIView.h文件中可 ...
- EntityFramework_MVC4中EF5 新手入门教程之二 ---2.执行基本的 CRUD 功能
在前面的教程中,您创建 MVC 应用程序中,存储和显示数据使用实体框架和 SQL 服务器 LocalDB.在本教程中,您会审查和自定义的 CRUD (创建. 读取. 更新. 删除) MVC 脚手架会自 ...
- Bootstrap3.0学习第十八轮(JavaScript插件——下拉菜单)
详情请查看 http://aehyok.com/Blog/Detail/25.html 个人网站地址:aehyok.com QQ 技术群号:206058845,验证码为:aehyok 本文文章链接:h ...
- web前端开发教程系列-2 - 前端开发书籍分享
目录: 前言 一. CSS 二. JavaScript 三. jQuery 四. 后记 前言 前端书籍在每个商城或书架上面都是琳琅满目,很多初学者又不能很好的判断书的质量或层次.因为今天给同学们分 ...
- Javascript基础系列之(五)条件语句(比较操作符)
和其他语言一样,JavaScript也有条件语句对流程上进行判断.包括各种操作符合逻辑语句 比较操作符 常用的比较操作符有 等于 == , 不等于!= , 大于 >, 小于 < ...
- Memcached——非关系型数据库分布式处理
Memcached登录校验应用: MMCacheWriter.cs类 using Memcached.ClientLibrary; using System; using System.Collect ...