jQuery.noConflict () method - problem jquery library and other libraries Conflict Resolution

When using the jQuery, you may also use other JS libraries such as Prototype, but may conflict with the coexistence of multiple database; if the conflict can be resolved through jQuery.noConflict () method

Definition and Usage

noConflict () method of transferring variable $ jQuery control.

This method releases jQuery control of the $ variable.

This method can be used to specify a custom name for the new variable jQuery.

Tip: When using other JavaScript libraries for $ function, which is useful.

grammar

jQuery.noConflict(removeAll)
parameter description
removeAll Boolean value. Indicating whether to allow complete reduction of the jQuery variable.

Explanation

Many JavaScript libraries use $ as a function or variable name, jQuery, too. In jQuery, jQuery $ is only an alias, even without the use of $ can guarantee that all functionality. If we need to use a JavaScript library outside of jQuery, we can control is returned to the library by calling $ .noConflict ():

A,  the jQuery library before introducing another library directly using jQuery (callback) Method :

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!--先导入jQuery -->
<script src="http://www.cnblogs.com/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 --- the prototype </ P > 
< P > Test --- the jQuery </ P > 
< Script type = "text / JavaScript" > 
the jQuery ( function () {         // directly jQuery, not necessary to call "jQuery.noConflict ()" function. 
  the jQuery ( " P " ) .click ( function () { 
       Alert (the jQuery ( the this ) .text ()); 
  }); 
}); 
$ ( " PP " ). . style.display =  'none'; //使用prototype
</script>
</body>
</html>

Two, jQuery library into the library after the other, using jQuery.noConflict () method of transferring control to the variable $ other libraries , in the following ways:

<Script type = "text / JavaScript"> 
jQuery.noConflict (); // $ variable control of the transfer to the prototype.js 
the jQuery ( function () { // Use the jQuery 
       the jQuery ( "P") the Click (. function () { 
              Alert (the jQuery ( the this ) .text ()); 
       }); 
}); 

$ ( . "PP"). style.display = 'none'; // use the prototype 
</ Script> // Code two 
<script = type "text / JavaScript"> var $ J = jQuery.noConflict (); // a custom short shortcut 
$ J ( function () { // use the jQuery 
       $ J ( "P").click(function(){
       alert( $j(


the this ) .text ()); 
       }); 
}); 

$ ( "PP"). style.display = 'none';. // use the prototype 
</ Script> // Code three 
<script type = "text / javascript " > 
jQuery.noConflict ();      // $ variable give control of prototype.js 
jQuery ( function ($) {       // use jQuery 
       $ ( "the p-") the Click (. function () { // continue to use $ method 
       Alert ($ ( the this ) .text ()); 
       }); 
}); 
$ ( "PP"). style.display = 'none';. // use the prototype 
</ Script> // Code four





<Script type = "text / JavaScript"> 
jQuery.noConflict ();                // $ variable control of the transfer to the prototype.js 
( function ($) {   // define anonymous functions and parameter set to $ 
       $ ( function () { // anonymous inner function $ are the jQuery 
              $ ( "P") the Click (. function () { // continue $ method 
                     Alert ($ ( the this ) .text ()); 
              }); 
       }); 
}) (the jQuery); // perform anonymous function arguments and pass the jQuery 

$ ( "PP"). style.display = 'none';. // use the prototype 

/ * ************* ************************************************** ***** / 
The jQuery (Document) .ready ( function () { //    a load when the page out will allow claim 
        jQuery.noConflict (); 
});
 </ Script>

 

Reproduced in: https: //www.cnblogs.com/JoannaQ/archive/2013/04/06/3001858.html

Guess you like

Origin blog.csdn.net/weixin_34004576/article/details/93056143