怎样让jQuery和其它js库共存

有时候需要同时使用jQuery和其它javascript,比如在joomla中默认的是motools,但很多人还是希 望能够使用jQuery,如果直接调用的话,由于两个库都使用了$作为简写,会造成程序冲突的情况,那么 ,怎样让jQuery和其它javascript库共存呢?有以下三种方法(均来自于官方网站):

1.覆盖$ 函数,使用jQuery代替$

在jQuery和其它库已经加载之后,可以调用jQuery.noConflict ().

 
   <script src="prototype.js"></script>
   <script src="jquery.js"></script>
   <script type="text/javascript"><!--
     jQuery.noConflict();
 
     // Use jQuery via jQuery(...)
     jQuery(document).ready(function(){
       jQuery("div").hide();
     });
 
     // Use Prototype with $(...), etc.
     $('someid').hide();
 
// --></script>
 
 
 
 

这样会使$恢复到原始库,在下面的代码中使用"jQuery",而不是"$"

2.使用简称来代替 $

 
 
   <script src="prototype.js"></script>
   <script src="jquery.js"></script>
   <script type="text/javascript"><!--
     var $j = jQuery.noConflict();
 
     // Use jQuery via $j(...)
     $j(document).ready(function(){
       $j("div").hide();
     });
 
     // Use Prototype with $(...), etc.
     $('someid').hide();
 
// --></script>
 
 
 

这样的话相当于$j代替$,是比较接近的一种用法了,当然可以使用其它自己喜欢的字符,比如 $J,$jq等等。

3.希望保留$

如果确实希望保留$而不是使用其它名称来代替,还有一种方 法。

 <html>
 <head>
   <script src="prototype.js"></script>
   <script src="jquery.js"></script>
   <script>
     jQuery.noConflict();
 
     // Put all your code in your document ready area
     jQuery(document).ready(function($){
       // Do jQuery stuff using $
       $("div").hide();
     });
 
     // Use Prototype with $(...), etc.
     $('someid').hide();
   </script>
 </head>
 <body></body>
 </html>

怎样让jQuery和其它js库共存的更多相关文章

  1. jQuery与其他JS库共存

    * 事件 * jQuery与其他JS库共存 * 调用jQuery.noConflict()方法 * 表示jQuery将"$"符号的使用权交出 * 通过两种方式将"$&qu ...

  2. jQuery与其他JS库冲突解决

    实际开发中遇到JQuery与其他js库起冲突 究其原因,是它们的全局对象定义冲突了,特别是变量”$”, 可重载$函数.使用jQuery.noConflict()就可以通过重载$函数 例:项目中应用的 ...

  3. jquery 之事件 多库共存(noConflict)

    /*jquery 之 简单事件jquery 与其它库共存,提供了 .noConflict() 方法,用法如下<script src="jquery 库"><scr ...

  4. jQuery与其它js库共用

    <script src="js/zepto.min.js"></script>//其它js库<script src="http://comm ...

  5. 解决jQuery多个版本,与其他js库冲突方法

    jQuery多个版本或和其他js库冲突主要是常用的$符号的问题,这个问题 jquery早早就有给我们预留处理方法了,下面一起来看看解决办法. 1.同一页面jQuery多个版本或冲突解决方法. < ...

  6. 解决同一页面jQuery多个版本或和其他js库冲突方法

    <!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> ...

  7. 在easyUI开发中,出现jquery.easyui.min.js函数库问题

    easyUI是jquery的一个插件,是民间的插件.easyUI使用起来很方便,里面有网页制作的最重要的三大方块:javascript代码.html代码和Css样式.我们在导入easyUI库后,可以直 ...

  8. 从零开始学 Web 之 jQuery(八)each,多库共存,包装集,插件

    大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...

  9. jQuery多库共存问题解决方法

    一.问题概述: 1.随着jQuery的流行,采用jQuery和$符为命名空间的js库越来越多,当然jQuery的$符也是参照的Prototype库的,所以当多个库同时以$符或者jQuery为命名空间时 ...

随机推荐

  1. 文件的哈希值不在指定的目录文件中。此文件可能已损坏或被篡(Windows10 /Windows8.1)

    ------------------------------------------Windows10------------------------------------------------ ...

  2. perl5 第十三章 Perl的面向对象编程

    第十三章 Perl的面向对象编程 by flamephoenix 一.模块简介二.Perl中的类三.创建类四.构造函数 实例变量 五.方法六.方法的输出七.方法的调用八.重载九.析构函数十.继承十一. ...

  3. 九款让WordPress成为赚钱利器的广告插件

    Blog有了很不错的流量后,看到别人博客挂的广告挣$,是否也有挂广告的冲动,但是,修改wordpress模版去让人不厌其烦,布局.样式都的重新修改一下,为了不那么麻烦,笔者整理的几款wordpress ...

  4. uva 10651 - Pebble Solitaire(记忆化搜索)

    题目链接:10651 - Pebble Solitaire 题目大意:给出一个12格的棋盘,‘o'代表摆放棋子,’-‘代表没有棋子, 当满足’-oo'时, 最右边的棋子可以跳到最左边的位子,而中间的棋 ...

  5. Android4.3模拟器界面中右侧菜单按钮无法使用问题解决办法

    开发环境:笔记本电脑Windows2008+MyEclipse 10+Android4.3 问题描述:运行或者调试Android项目时,发现模拟器中右侧Menu按钮无法点击,截图如下: 查看在Andr ...

  6. linux目录对照命令——meld

    preface:也不算是非常大的事情,但也须要这么个东西.对照两个目录里的内容是否同样,知道差异在哪里.找出问题所在,vimdiff 仅仅能比較两个文件是否同样,比較不了目录,只是能够写个bash脚本 ...

  7. cocos2d基础入门

    HelloCpp中Classes目录下放开发者自己的类: win32:平台相关,coco2d已默认创建:coco2d-x目录下,samples/cpp/HelloCpp/(工程根目录)图片放置位置:根 ...

  8. <input type="text">文本输人框

    type类型: text  文本框 password  口令密码输人框 reset  重置或清除 buttou  命令按钮 checkbox  复选框 radio  单选框 submit  提交 fi ...

  9. [译]MDX 介绍

    关于MDX MDX (Multi Dimensional eXpression language) 是非常强大的工具,可以将你的多维数据库/cube 发挥到极致. 本文会覆盖MDX基础,并且希望能使你 ...

  10. java结构与算法之冒泡排序

    一.什么是冒泡排序:冒泡排序是在从相邻两个数之间进行比较,这里将前面一个值定义为before,后面一个值定义为after:当before>after时i,交换他们的值,如果before<a ...