首页 > Web开发 > 详细

解决jQuery插件冲突

时间:2014-03-26 07:17:54      阅读:493      评论:0      收藏:0      [点我收藏+]

    项目框架的JS库集成了jQuery,Layout页面(模板页面,类似ASP.NET的母版页)中引用了这些JS,后来使用图表插件(图表插件是基于jQuery的)的时候,项目框架中的JS和图表插件有冲突,图表显示不出来。解决步骤如下:

    1、通过搜索替换将图表插件的  $.  和  $(  全部替换成  jQuery.  和  jQuery(  

    2、在使用图表插件的页面,首先引用jQuery,然后添加<script type="text/javascript"> jQuery.noConflict();</script>,最后引用图表插件JS

    代码如下:

<script type="text/javascript" src="~js/bui/jquery-1.8.1.min.js"></script>
<script type="text/javascript">    jQuery.noConflict();</script>
<script type="text/javascript" src="~js/bui/bui-min.js"></script>
<script type="text/javascript" src="~js/bui/chart-min.js"></script>
<script type="text/javascript" src="~js/bui/graphic-min.js"></script>

    由于项目框架的JS库集成的是jQuery,所以在图表页面中,$ 和 jQuery 都可以使用,例如:$("div")和jQuery("div")都是正确的。

 

    如果有多个jQuery插件冲突,可以这样做:

    1、通过搜索替换将图表插件的  $.  和  $(  全部替换成  myChart.  和  myChart( 

    2、在使用图表插件的页面,首先引用jQuery,然后添加<script type="text/javascript"> var myChart = jQuery.noConflict();</script>,最后引用图表插件JS

    代码如下:

<script type="text/javascript" src="~js/bui/jquery-1.8.1.min.js"></script>
<script type="text/javascript">    var myChart = jQuery.noConflict();</script>
<script type="text/javascript" src="~js/bui/bui-min.js"></script>
<script type="text/javascript" src="~js/bui/chart-min.js"></script>
<script type="text/javascript" src="~js/bui/graphic-min.js"></script>

     这样就可以在图表插件页面这样使用jQuery:myChart("div")

解决jQuery插件冲突,布布扣,bubuko.com

解决jQuery插件冲突

原文:http://www.cnblogs.com/s0611163/p/3624034.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!