我们项目现在需要用到两个js库.一个是jQuery库,还有一个是我们自己开发的轻量级的gys.js库.
而gys库对外提供的接口也是$符号.和jQuery库是一样的,这个时候,两个库就会发生冲突了,我们就需要让jQuery的$让出来.
可以这样解决.
一:jQuery.js库的引用在gys.js前面.直接使用jQuery(),没有必要使用jQuery.noConflict()
1 <head runat="server"> 2 <title></title> 3 <script src="jquery1.7.js" type="text/javascript"></script> 4 <script src="gys.js" type="text/javascript"></script> 5 </head>
1 <script src="jquery1.7.js" type="text/javascript"></script> 2 <script src="gys.js" type="text/javascript"></script> 3 <script type="text/javascript"> 4 jQuery(function () {//jQuery的使用 5 jQuery("#btn").click(function () { 6 alert(jQuery(this).val()); 7 }); 8 }); 9 $("p").style.display="none";//gys库的使用 10 </script>
二.jQuery.js库的引用在gys.js后面.需要使用jQuery.noConflict();
写法1:
1 <title></title> 2 <script src="gys.js" type="text/javascript"></script> 3 <script src="jquery1.7.js" type="text/javascript"></script>
1 <script src="gys.js" type="text/javascript"></script> 2 <script src="jquery1.7.js" type="text/javascript"></script> 3 <script type="text/javascript"> 4 jQuery.noConflict(); //将jQuery的$让渡出去. 5 jQuery(function () { 6 jQuery("#btn").click(function () { 7 alert(jQuery(this).val()); 8 }); 9 }); 10 $("p").style.color = "red"; //gys库的使用 11 </script>
写法2:
<script src="gys.js" type="text/javascript"></script>
<script src="jquery1.7.js" type="text/javascript"></script>
<script type="text/javascript">
var guo = jQuery.noConflict(); //将jQuery的$让渡给新的变量guo.
guo(function ($) {
$("#btn").click(function () {
alert($(this).val());
});
});
$("p").style.color = "red"; //gys库的使用
</script>