jQuery中 noConflict() 方法使用


Posted in Javascript onApril 25, 2013

jQuery 和其他 JavaScript 框架
正如您已经了解到的,jQuery 使用 $ 符号作为 jQuery 的简写。

如果其他 JavaScript 框架也使用 $ 符号作为简写怎么办?

其他一些 JavaScript 框架包括:MooTools、Backbone、Sammy、Cappuccino、Knockout、JavaScript MVC、Google Web Toolkit、Google Closure、Ember、Batman 以及 Ext JS。

其中某些框架也使用 $ 符号作为简写(就像 jQuery),如果您在用的两种不同的框架正在使用相同的简写符号,有可能导致脚本停止运行。

jQuery 的团队考虑到了这个问题,并实现了 noConflict() 方法。

jQuery noConflict() 方法
noConflict() 方法会释放会 $ 标识符的控制,这样其他脚本就可以使用它了。

实例
当然,您仍然可以通过全名替代简写的方式来使用 jQuery:

$.noConflict();
jQuery(document).ready(function(){
  jQuery("button").click(function(){
    jQuery("p").text("jQuery 仍在运行!");
  });
});

实例
您也可以创建自己的简写。noConflict() 可返回对 jQuery 的引用,您可以把它存入变量,以供稍后使用。请看这个例子:
var jq = $.noConflict();
jq(document).ready(function(){
  jq("button").click(function(){
    jq("p").text("jQuery 仍在运行!");
  });
});

实例
如果你的 jQuery 代码块使用 $ 简写,并且您不愿意改变这个快捷方式,那么您可以把 $ 符号作为变量传递给 ready 方法。这样就可以在函数内使用 $ 符号了 - 而在函数外,依旧不得不使用 "jQuery":
$.noConflict();
jQuery(document).ready(function($){
  $("button").click(function(){
    $("p").text("jQuery 仍在运行!");
  });
});
Javascript 相关文章推荐
JQuery入门——用bind方法绑定事件处理函数应用介绍
Feb 05 Javascript
chrome下jq width()方法取值为0的解决方法
May 26 Javascript
js判断变量初始化的三种形式及推荐用的形式
Jul 22 Javascript
javascript实现超炫的向上滑行菜单实例
Aug 03 Javascript
轻松搞定jQuery.noConflict()
Feb 15 Javascript
基于javascript实现按圆形排列DIV元素(三)
Dec 02 Javascript
Node.js利用Net模块实现多人命令行聊天室的方法
Dec 23 Javascript
JS控件bootstrap suggest plugin使用方法详解
Mar 25 Javascript
React中jquery引用的实现方法
Sep 12 jQuery
详解webpack模块加载器兼打包工具
Sep 11 Javascript
利用Dectorator分模块存储Vuex状态的实现
Feb 05 Javascript
javascript实现移动端触屏拖拽功能
Jul 29 Javascript
只需20行代码就可以写出CSS覆盖率测试脚本
Apr 24 #Javascript
js Array对象的扩展函数代码
Apr 24 #Javascript
网页中返回顶部代码(多种方法)另附注释说明
Apr 24 #Javascript
onkeypress字符按键兼容所有浏览器使用介绍
Apr 24 #Javascript
纯JS实现五子棋游戏兼容各浏览器(附源码)
Apr 24 #Javascript
jquery仿京东导航/仿淘宝商城左侧分类导航下拉菜单效果
Apr 24 #Javascript
基于jQuery实现图片的前进与后退功能
Apr 24 #Javascript
You might like
php代码优化及php相关问题总结
2006/10/09 PHP
PHP文件及文件夹操作之创建、删除、移动、复制
2016/07/13 PHP
学习YUI.Ext 第七天--关于View&JSONView
2007/03/10 Javascript
jquery动态加载图片数据练习代码
2011/08/04 Javascript
jquery数组过滤筛选方法grep()简介
2014/06/06 Javascript
JS跨域问题详解
2014/11/25 Javascript
JavaScript实现的一个计算数字步数的算法分享
2014/12/06 Javascript
js中for in语句的用法讲解
2015/04/24 Javascript
基于zepto的移动端轻量级日期插件--date_picker
2016/03/04 Javascript
JavaScript自学笔记(必看篇)
2016/06/23 Javascript
javascript基础知识讲解
2017/01/11 Javascript
微信小程序中子页面向父页面传值实例详解
2017/03/20 Javascript
angular.JS实现网页禁用调试、复制和剪切
2017/03/31 Javascript
jquery ui sortable拖拽后保存位置
2017/04/27 jQuery
解决浏览器会自动填充密码的问题
2017/04/28 Javascript
JS实现点击Radio动态更新table数据
2017/07/18 Javascript
Node.js进阶之核心模块https入门
2018/05/23 Javascript
Node.js连接Sql Server 2008及数据层封装详解
2018/08/27 Javascript
微信小程序 简易计算器实现代码实例
2019/09/02 Javascript
JavaScript常用8种数组去重代码实例
2020/09/09 Javascript
[01:15:16]DOTA2-DPC中国联赛 正赛 Elephant vs Aster BO3 第一场 1月26日
2021/03/11 DOTA
使用BeautifulSoup爬虫程序获取百度搜索结果的标题和url示例
2014/01/19 Python
paramiko模块安装和使用(远程登录服务器)
2014/01/27 Python
Python的GUI框架PySide的安装配置教程
2016/02/16 Python
Python 多线程实例详解
2017/03/25 Python
解决Django模板无法使用perms变量问题的方法
2017/09/10 Python
详解python里使用正则表达式的全匹配功能
2017/10/19 Python
Pycharm运行加载文本出现错误的解决方法
2019/06/27 Python
python模拟实现斗地主发牌
2020/01/07 Python
Python 改变数组类型为uint8的实现
2020/04/09 Python
手把手教你实现一个canvas智绘画板的方法
2019/03/04 HTML / CSS
模具设计与制造专业应届生求职信
2013/10/18 职场文书
工作总结与自我评价
2014/09/18 职场文书
公司租车协议书
2015/01/29 职场文书
2015年度学校卫生工作总结
2015/05/12 职场文书
2019年个人工作总结范文
2019/03/25 职场文书