frontopen主题V1.5.04.15版本已发布 推荐更新！
frontopen “讨论区” 正式上线
鸣谢主题捐赠者：感叹帝,Calon YE，孙玉龙，魂客，创想，孜夕寒
顾余笑，小菜，晨风，菠菜，*忠杰，浪子，99开发赞助，IT江湖，小熊
如果发现更新最新版出现缩略图无法显示，请先装回v1.4.03.02版本
关于JQuery和其他JS插件库相冲突的解决办法
关于JQuery和其他JS插件库相冲突的解决办法
围观3011次
编辑日期： 字体：
本文是解决这个问题的方法总结，亲测可用。
关于jQuery冲突问题我知道这个问题是jQuery的$跟discuz冲突了，但是我已经把$重新定义了，var jq = jQuery.noConflict();并且jQuery都覆盖了，但是还是会出现错误，错误是：没改前是帖子幻灯片模块无法显示（不知道还有么有其他无法显示，我的是幻灯片你无法显示），修改后则是登陆和注册失效，各位大侠快来帮帮忙啊~这个问题都快就吵我好长时间了，就是解决不了…..
在代码前加入下面代码 把之后的jquery中的$都用jq代替即可。
&script type=”text/javascript”&
jq = jQuery.noConflict();
//以后jquery中的$都用jq代替即可。
jq(function(){});
本文固定链接:
转载请注明:
作者：zhoumeng
这个作者貌似有点懒，什么都没有留下。
如果您觉得这篇文章有用处，请支持作者！鼓励作者写出更好更多的文章！
您可能还会对这些文章感兴趣！完美解决网站jquery冲突导致js交互失效的方法
　　jQuery是一个兼容多浏览器的JavaScript框架，关键是免费开源，有时候为了实现某种交互式行为，设计者也必须向用户提供视觉上的反馈。这就是它的牛逼之处了。
　　而且呢，jQuery还能够实现网页样式的改变。听起来像CSS干的事情。当所有浏览器不完全支持相同的标准时，单纯用CSS会显得吃力。&jQuery
可以弥补CSS的不足，它提供了跨浏览器的标准解决方案，改变样式属性分分钟的事儿。
　　不过，有些JS在不同的浏览器里所得出的效果是不一样的，因此在制作网页的时候需要考虑到不同浏览器直接的兼容性。试想下，你写了一个js公共组件public.js，该组件需要用到jquery，为了不出岔子，得需考虑$符号冲突问题、多个JS不兼容等的问题。
　　想想也是醉了
　　看下图，如果JS和jQuery出现冲突的时候，切换根本是没作用的。
　　马氪软件这边就不去多累赘了，把我们在实际操作中的经验分享给大家。例如上面的例子，JS文件中的一段如下：
//Tab-选项卡切换
$(function(){
$(".tab .tab_li").hover(function(){
$(this).parent().find(".tab_li").removeClass("tab_am");
$(this).addClass("tab_am");
var cutNum=$(this).parent().find(".tab_li").index(this);
$(this).parents(".tab").find(".tab_con").hide();
$(this).parents(".tab").find(".tab_con").eq(cutNum).show();
$(function(){
$(".tab2 .tab_li").click(function(){
$(this).parent().find(".tab_li").removeClass("tab_am");
$(this).addClass("tab_am");
var cutNum=$(this).parent().find(".tab_li").index(this);
$(this).parents(".tab2").find(".tab_con").hide();
$(this).parents(".tab2").find(".tab_con").eq(cutNum).show();
　　如果要实现jQuery和其他JS互不干扰，各尽其职，具体的代码如下
　　(function($) {
　　//把你写好的js代码复制到这边
&（例如把//Tab-选项卡切换这一段加进来）
　　})(jQuery);
　　这样的方法，使得修改后的JS不会影响到其他JS文件，仅仅会影响到被包在jQuery(function($){}中的代码，运行起来速度比较稳定。
　　这个方法在开发js插件时经常被用到，形式也可以改成如下：
　　jQuery(function($){
　　//你的js代码放在这里（例如是ready函数和子函数）
　　//如果是js文件，其实就是在文件头部和尾部各加一行代码
　　牛逼的不？jQuery 提供了截取形形色色的页面事件
（比如用户单击一个链接）的适当方式，而不需要使用事件处理程序搞乱HTML 代码。此外，它的事件处理API 也消除了经常困扰Web
开发人员的浏览器不一致性。
原文链接：&
&马氪软件-&&&&
已投稿到：
以上网友发言只代表其个人观点，不代表新浪网的观点或立场。jQuery和Discuz js 不兼容问题解决方法 | 无忧主机
今天无忧小编遇到个用户提问，在做X2.5主题的时候，用到jquery的时候和原来主题js冲突。于是无忧主机小编在此花了些时间来测试，发现这个主要是因为使用了$(id)
作为dom节点的获取方法，而并不是$符号刚好与jQuery的默认符号相冲突的原因。
既然找到了原因那就好办了，以下是基于之前的Discuz X和jQuery冲突的解决办法。无忧
主机主机小编在此给大家做个参考。
首先将jQuery的js文件jquery-1.8.0.min.js放到/static/js目录下，以下两个方法共用此文件，如不是放在该目录下，后面的代码请对应修改。
1、修改/template/default/common/header_common.htm，在第16行代码
&base href=”{$_G[‘siteurl’]}” /& 之后增加以下代码
&script src=”{$_G[setting][jspath]}jquery-1.8.0.min.js?{VERHASH}”&&/script&
之后用到jQuery的$(的地方用jQuery(代替。
2、修改/template/default/common/header.htm，在第19行代码
src=”{$_G[setting][jspath]}home.js?{VERHASH}”&&/script& 之后增加以下代码：
&script src=”{$_G[setting][jspath]}jquery-1.8.0.min.js?{VERHASH}”&&/script&
之后用到jQuery的$(的地方用jQuery(代替。
替换之后应该是解决js冲突问题。
无忧主机相关文章推荐阅读：
本文地址：http://www.51php.com/discuz/15020.html
喜欢本文或觉得本文对您有帮助，请分享给您的朋友 ^_^
无忧主机资质：（十四年旗舰品牌）
相关技术帮助文档
技术帮助文档分类解决同一页面jQuery多个版本或和其他js库冲突方法
作者：用户
本文讲的是解决同一页面jQuery多个版本或和其他js库冲突方法，
1.同一页面jQuery多个版本或冲突解决方法
&!DOCTYPE html&
&html lang=&en& xmlns=&http://www.w3.org/1999/
1.同一页面jQuery多个版本或冲突解决方法
&!DOCTYPE &
&html lang="en" xmlns="http://www.w3.org/1999/xhtml"&
&meta charset="utf-8" /&
&title&jQuery测试页-111cn.net&/title&
&!-- 引入 jquery 1.8.0 --&
&script type="text/javascript" src="http://code.jquery.com/jquery-1.8.0.min.js"&&/script&
&script type="text/javascript"&
var $180 = $;
&!-- 引入 jquery 1.9.0 --&
&script type="text/javascript" src="http://code.jquery.com/jquery-1.9.0.min.js"&&/script&
&script type="text/javascript"&
var $190 = $;
&!-- 引入 jquery 2.0.0 --&
&script type="text/javascript" src="http://code.jquery.com/jquery-2.0.0.min.js"&&/script&
&script type="text/javascript"&
var $200 = $;
&script type="text/javascript"&
console.log($180.fn.jquery);
console.log($190.fn.jquery);
console.log($200.fn.jquery);
2.同一页面jQuery和其他js库冲突解决方法
①.jQuery在其他js库前
&!DOCTYPE html&
&html lang="en" xmlns="http://www.w3.org/1999/xhtml"&
&meta charset="utf-8" /&
&title&jQuery测试页-111cn.net&/title&
&!-- 引入 jquery 1.8.0 --&
&script type="text/javascript" src="http://code.jquery.com/jquery-1.8.0.min.js"&&/script&
&script type="text/javascript"&
var $180 = $;
console.log($.fn.jquery);
&!-- 引入 其他库--&
&script type="text/javascript"&
jquery:"111cn.net"
&script type="text/javascript"&
console.log($.fn.jquery);
console.log($180.fn.jquery);
②.jQuery在其他js库后
&!DOCTYPE html&
&html lang="en" xmlns="http://www.w3.org/1999/xhtml"&
&meta charset="utf-8" /&
&title&jQuery测试页-111cn.net&/title&
&!-- 引入 其他库--&
&script type="text/javascript"&
jquery:"111cn.net"
&!-- 引入 jquery 1.8.0 --&
&script type="text/javascript" src="http://code.jquery.com/jquery-1.8.0.min.js"&&/script&
&script type="text/javascript"&
console.log($.fn.jquery);
var $180 = $.noConflict();
console.log($.fn.jquery);
console.log($180.fn.jquery);
再补充一下方法
方案1： 引入noConflict(),将$替换为其他符号
var $j = jQuery.noConflict();
$j(document).ready(function(){
$j("#btn1").click(function(){
alert("Text: " + $j("#test").text());
缺点：引入了这段代码后，不仅是当前的js文件，该html引用的所有js中，如果有用到jquery中的$，都得用$j来代替之前的$
ready函数是jquery的入口函数，可以
将$(document).ready(function(){
jQuery( document ).ready(function( $){}
缺点：只对ready嵌套内的代码有效，对嵌套外的代码是无效的。如果你所有的逻辑，都在写ready函数中，那没问题。但我们一般都会在ready函数之外写一些子函数，然后ready函数再去调用这些函数。这个方案对这些函数是无效的，因此这套方案有局限性。
方案3（推荐，特别是js插件时）：
给js内容包上一个函数
jQuery(function($){
//你的js代码放在这里（例如第二个方案提到的ready函数和子函数）
//如果是js文件，其实就是在文件头部和尾部各加一行代码
(function($) {
//你的js代码
})(jQuery);
这个方法，没有上面两个方案的缺点，只会影响到被包在jQuery(function($){}中的代码。
不会影响到其他js代码，这一点很重要。试想一下，假如你写了一个js公共组件，该组件需要用到jquery，为了提高鲁棒性，需考虑$符号冲突问题。如果使用方案1，那么别人在使用时，还得遵守你的约定，把自己js代码中的$改成$,而如果使用方案3，既能避免$冲突对该组件的影响，又无需要求使用公共组件的人修改自己的代码。
以上是云栖社区小编为您精心准备的的内容，在云栖社区的博客、问答、公众号、人物、课程等栏目也有的相关内容，欢迎继续使用右上角搜索按钮进行搜索net
jquery 版本冲突解决、jquery 冲突解决、jquery冲突解决办法、如何解决jquery冲突、jquery冲突怎么解决，以便于您获取更多的相关知识。
弹性可伸缩的计算服务，助您降低 IT 成本，提升运维效率
40+云计算产品，6个月免费体验
稳定可靠、可弹性伸缩的在线数据库服务，全球最受欢迎的开源数据库之一
云服务器9.9元/月，大学必备
云栖社区(yq.aliyun.com)为您免费提供相关信息，包括
，所有相关内容均不代表云栖社区的意见！最近开发遇见了一个这个样的情况，一个button在一个div中，点击buton是一个事件，点击大的div也是一个事件，但是由于button在div中，点击button会把两个事件都执行了，但是我们想点击button的时候不去执行大div的事件。层次如图：
解决方法 ：
　　　　在button的点击事件执行的时候调使用&& event.stopPropagation() 方法，具体使用如下代码：
//点击button的方法
function clickBtn(event){
//具体的事件内容。。。。。
stopBubbling(event);
function stopBubbling(e) {
e = window.event ||
if (e.stopPropagation) {
e.stopPropagation();
//阻止事件 冒泡传播
e.cancelBubble = true;
-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
&ps:　　W3CSchoo对stopPropagation的解释
阅读(...) 评论()}