最近遇到个问题，同时引用了jquery库和另外一个js库。当用$xx去调用js库函数时，发现失效了！于是找资料，原来是jquery命名冲突了。因为许多javascript 库使用$作为函数或变量名，jquery也一样。其实$只是jquery的一个别名而已，假如我们需要使用jquery 之外的另一js库，我们可以通过调用 $.noconflict() 向该库返回控制权。下面是收集到解决这一问题的五种方案，总有一种你会用得上的。
例一：
复制代码 代码如下:
ttp://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script src="prototype-1.6.0.3.js" type="text/javascript"></script>
<script src="/scripts/jquery-1.3.1.js" type="text/javascript"></script>
test---prototype
test---jQuery
<script type="text/javascript"> <br> jQuery.noConflict(); //将变量$的控制权让渡给prototype.js <br> jQuery(function(){ //使用jQuery <br> jQuery("p").click(function(){ <br> alert( jQuery(this).text() ); <br> }); <br> }); <br> $("pp").style.display = 'none'; //使用prototype <br> </script>
例二：
复制代码 代码如下:
ttp://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script src="prototype-1.6.0.3.js" type="text/javascript"></script>
<script src="/scripts/jquery-1.3.1.js" type="text/javascript"></script>
test---prototype
test---jQuery
<script type="text/javascript"> <br> var $j = jQuery.noConflict(); //自定义一个比较短快捷方式 <br> $j(function(){ //使用jQuery <br> $j("p").click(function(){ <br> alert( $j(this).text() ); <br> }); <br> }); <br> $("pp").style.display = 'none'; //使用prototype <br> </script>
例三：
复制代码 代码如下:
ttp://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script src="prototype-1.6.0.3.js" type="text/javascript"></script>
<script src="/scripts/jquery-1.3.1.js" type="text/javascript"></script>
test---prototype
test---jQuery
<script type="text/javascript"> <br> jQuery.noConflict(); //将变量$的控制权让渡给prototype.js <br> jQuery(function($){ //使用jQuery <br> $("p").click(function(){ //继续使用 $ 方法 <br> alert( $(this).text() ); <br> }); <br> }); <br> $("pp").style.display = 'none'; //使用prototype <br> </script>
例四：
复制代码 代码如下:
ttp://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script src="prototype-1.6.0.3.js" type="text/javascript"></script>
<script src="/scripts/jquery-1.3.1.js" type="text/javascript"></script>
test---prototype
test---jQuery
<script type="text/javascript"> <br> jQuery.noConflict(); //将变量$的控制权让渡给prototype.js <br> (function($){ //定义匿名函数并设置形参为$ <br> $(function(){ //匿名函数内部的$均为jQuery <br> $("p").click(function(){ //继续使用 $ 方法 <br> alert($(this).text()); <br> }); <br> }); <br> })(jQuery); //执行匿名函数且传递实参jQuery <br> $("pp").style.display = 'none'; //使用prototype <br> </script>
例五：
复制代码 代码如下:
ttp://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script src="/scripts/jquery-1.3.1.js" type="text/javascript"></script>
<script src="prototype-1.6.0.3.js" type="text/javascript"></script>
test---prototype
test---jQuery
<script type="text/javascript"> <br> jQuery(function(){ //直接使用 jQuery ,没有必要调用"jQuery.noConflict()"函数。 <br> jQuery("p").click(function(){ <br> alert( jQuery(this).text() ); <br> }); <br> }); <br> $("pp").style.display = 'none'; //使用prototype <br> </script>
看，原来解决问题的方法可不止一个两个呢，有需要的小伙伴们自己来取吧
