Noconflict fails to win the conflict between prototype. js and jquery. js.

ArticleDirectory

• 1. Common methods to solve prototype conflicts with jquery
• Ii. conflict issues I encountered
• Iii. demo of recreating the problem

1. Common methods to solve prototype conflicts with jquery

Even in a recent project, prototype and jquery libraries are used for historical reasons. It is reasonable to solve conflicts between the two libraries with the common $ keyword. There are two common methods:

1. Add <SCRIPT type = "text/JavaScript"> jquery. noconflict () below the jquery Library: </SCRIPT>

2. Use anonymous functions to seal the logic implemented by jquery (this method is used by almost all jquery plug-ins)

(Function ($ ){

// Here is the logic of jquery, $ is used as usual.

}) (Jquery );

 

The above two methods can basically solve the 99% conflict, but I happen to step on the shit and fall into the 1%...

Ii. conflict issues I encountered

As long as prototype. JS is referenced, even if prototype. JS is not used at the root, an exception "This. _ each is not a function" is thrown in prototype ".

Firebug,

Iii. demo of recreating the problem

The firebug tracking shows that if prototype is referenced and $ A is replaced with jquery, the above problem occurs when you start the copy again (see the yellow background line below ).

SimpleCodeExample,

 

    <  Script Type  =  "  Text/JavaScript  "  >  
  //  <! [CDATA [ 
  Jquery (document). Ready (  Function  ($ ){
  //  1, event test  
    VaR  $ Test  =  Jquery (  "  # Testdiv  "  ). Mouseover (  Function (E ){
Jquery (  This  ). Toggleclass (  "  R_on  "  ,  ""  );
});
  //  2, method test-replacewith  
  $ Test. replacewith ($ test. Clone (True ));
});
  //  ]>  
    <  /  SCRIPT> 

 

 

A simple demo to reproduce the problem,

Http://vivasky.com/labs/demo/jquery_prototype_test.html

 

If any hero has encountered and solved this problem, I hope you can give me some advice. No. In poor projects, you have to stop using the replacewith method to find another method.

In addition, I sent a letter of help at the official jquery Forum. They mentioned that noconflict could not completely solve the conflict problem. For the moment, this problem has not yet been solved...