discuz调用自定义jQuery与系统默认js文件冲突的解决方法

[复制链接] [添加相关主题]
godkings 发表于 2021-1-15 17:44:38
做一个插件,添加了一个自己的自定义jQuery文件,但是这个jQuery与系统默认的js文件有冲突,会出现好多的错误解决方法如下。
一般我们引用自定义的外部js文件是这样的:
  1. <script type="text/javascript" src="source/plugin/df_qrcode/template/jquery-3.5.1.slim.min.js"></script>
复制代码

如果直接使用就会有冲突,这时候只需要在上面这个js文件的下面再添加一句代码:
  1. <script type="text/javascript"> var jq = jQuery.noConflict(); </script>
复制代码

然后把用到该JS中"$"全部换成"jq"

例子:

  1.     <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script> //文件内的$全部替换为jq
  2.     <script type="text/javascript"> var jq = jQuery.noConflict(); </script>
  3.     <style type="text/css">
  4.     /* suspend */
  5.     .suspend{width:40px;height:198px;position:fixed;top:200px;right:0;overflow:hidden;z-index:9999;}
  6.     .suspend dl{width:120px;height:198px;border-radius:25px 0 0 25px;padding-left:40px;box-shadow:0 0 5px #e4e8ec;}
  7.     .suspend dl dt{width:40px;height:198px;background:url(img/suspend.png);position:absolute;top:0;left:0;cursor:pointer;}
  8.     .suspend dl dd.suspendQQ{width:120px;height:85px;background:#ffffff;}
  9.     .suspend dl dd.suspendQQ a{width:120px;height:85px;display:block;background:url(img/suspend.png) -40px 0;overflow:hidden;}
  10.     .suspend dl dd.suspendTel{width:120px;height:112px;background:#ffffff;border-top:1px solid #e4e8ec;}
  11.     .suspend dl dd.suspendTel a{width:120px;height:112px;display:block;background:url(img/suspend.png) -40px -86px;overflow:hidden;}
  12.     * html .suspend{position:absolute;left:expression(eval(document.documentElement.scrollRight));top:expression(eval(document.documentElement.scrollTop+200))}
  13.     </style>
  14.     <div class="suspend">
  15.         <dl>
  16.             <dt class="IE6PNG"></dt>
  17.             <dd class="suspendQQ"><a href="#" target="_blank"></a></dd>
  18.             <dd class="suspendTel"><a href="javascript:void(0);"></a></dd>
  19.         </dl>
  20.     </div>
  21.    
  22.     <script type="text/javascript">         
  23.     jq(document).ready(function(){
  24.    
  25.          jq(".suspend").mouseover(function() {
  26.             jq(this).stop();
  27.             jq(this).animate({width: 160}, 400);
  28.         })
  29.       
  30.         jq(".suspend").mouseout(function() {
  31.             jq(this).stop();
  32.             jq(this).animate({width: 40}, 400);
  33.         });
  34.       
  35.     });
  36.     </script>
复制代码


示例二,有多个外部jQuery文件:
  1. <script type="text/javascript" src="source/plugin/df_qrcode/template/jquery-3.5.1.slim.min.js"></script>
  2. <script type="text/javascript" src="source/plugin/df_qrcode/template/jquery.qrcode.min.js"></script>
  3. <script type="text/javascript"> var jq = jQuery.noConflict(); </script>
  4. <span class="dfqrcode">手机访问<img src="source/plugin/df_qrcode/template/sj.png" />
  5.         <span id="qrcode" class="qr">打开手机浏览器扫一扫<br></span>
  6. </span>
  7. <script>jq('#qrcode').qrcode({width:175,height:175,text:(window.location.href)});</script>
复制代码



上一篇:discuz提示对不起,您安装的不是正版应用,安装程序无法...
下一篇:discuz IS_ROBOT判断是否搜索引擎蜘蛛代码

相关帖子

回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ| Archiver|小黑屋| 颠覆霸主 ( 京ICP备12023415号-2 )

声明:本站的任何信息和内容仅代表作者的立场和观点,与颠覆霸主网无关。

禁止在颠覆霸主网发布任何与《中华人民共和国法律》相抵触的言论!

GMT+8, 2022-11-29 01:34 , Processed in 0.085596 second(s), 26 queries .

Powered by Discuz! X3.4

Copyright © 2001-2021, Tencent Cloud.