jquery库与其他库冲突的问题解决-jquery.noConflict()代码,JS代码库,德仔网

代码语言

代码分类

【JS】 jquery库与其他库冲突的问题解决-jquery.noConflict()

作者:starstroll / 发布于2014/9/22/ 774

jquery库与其他库冲突的问题解决-jquery.noConflict()


	一、 jQuery库在其他库之前导入，直接使用jQuery(callback)方法如：
	<html>
	<head>
	 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	 <!--先导入jQuery -->
	 <script src="../../scripts/jquery-1.3.1.js" type="text/javascript"></script>
	 <!--后导入其他库 -->
	 <script src="prototype-1.6.0.3.js" type="text/javascript"></script>
	</head>
	<body>
	 <p id="pp">test---prototype
	 test---jQuery

	 <script type="text/javascript">
	 jQuery(function () { //直接使用 jQuery ,没有必要调用"jQuery.noConflict()"函数。
	 jQuery("p").click(function () {
	 alert(jQuery(this).text());
	 });
	 });

	 $("pp").style.display = 'none'; //使用prototype
	</script>
	</body>
	</html>

	二、jQuery库在其他库之后导入，使用jQuery.noConflict()方法将变量$的控制权让渡给其他库，有以下几种方式:

	<script type="text/javascript">
	 jQuery.noConflict(); //将变量$的控制权让渡给prototype.js
	 jQuery(function () { //使用jQuery
	 jQuery("p").click(function () {
	 alert(jQuery(this).text());
	 });
	 });

	 $("pp").style.display = 'none'; //使用prototype
	</script>

	//代码二
	<script type="text/javascript">
	 var $j = jQuery.noConflict(); //自定义一个比较短快捷方式
	 $j(function () { //使用jQuery
	 $j("p").click(function () {
	 alert($j(this).text());
	 });
	 });

	 $("pp").style.display = 'none'; //使用prototype
	</script>

	//代码三
	<script type="text/javascript">
	 jQuery.noConflict(); //将变量$的控制权让渡给prototype.js
	 jQuery(function ($) { //使用jQuery
	 $("p").click(function () { //继续使用 $ 方法
	 alert($(this).text());
	 });
	 });

	 $("pp").style.display = 'none'; //使用prototype
	</script>

	//代码四
	<script type="text/javascript">
	 jQuery.noConflict(); //将变量$的控制权让渡给prototype.js
	 (function ($) { //定义匿名函数并设置形参为$
	 $(function () { //匿名函数内部的$均为jQuery
	 $("p").click(function () { //继续使用 $ 方法
	 alert($(this).text());
	 });
	 });
	 })(jQuery); //执行匿名函数且传递实参jQuery

	 $("pp").style.display = 'none'; //使用prototype

	 /*********************************************************************/
	 jQuery(document).ready(function () { //一加载页面的时候就将权利让出去
	 jQuery.noConflict();
	 });
	</script>

评论列表

本站所提供的代码，版权归原作者所有，若有侵犯作者版权，请与我们联系，我们将立即删除或修改。谢谢!
本站所有代码发布及提供者。

试试其它关键字

　jquery冲突　　库　　冲突　

同语言下

可能有用的

starstroll贡献的其它代码(2)