Prototype.js en conflit avec les plugins jquery

Question

Mon application utilise prototype.js depuis un certain temps. J'essaie maintenant d'utiliser jQuery et un plugin jquery pour certaines fonctionnalités améliorées. Cependant prototype.js et jQuery produisent un conflit pour l'utilisation de la variable '$'. Cela peut être résolu par la méthode noConflict() fournie par jQuery et je peux donc changer le raccourci jQuery en fonction de ce que je veux. Le problème est de savoir comment utiliser le plugin jQuery que je veux importer. Sûrement il y a un meilleur moyen que de trouver et de remplacer toutes les variables '$'.

Le plugin utilisé est 'Selectize' https://github.com/brianreavis/selectize.js

Answer 1

Vous avez modifié votre question pour dire:

Le plugin utilisé est 'Selectize' https://github.com/brianreavis/selectize.js

Ce plug-in doesn ne pas compter sur le symbole $ global du tout; il n'y a rien que vous devez faire pour rendre le plugin compatible avec un site qui utilise $ pour quelque chose d'autre (comme Prototype). Le plugin se base uniquement sur le symbole jQuery. (Il utilise $ en interne, mais seulement en tant que variable locale, il n'utilise pas le global.) Tout plugin jQuery correctement écrit évite d'utiliser le $ global, à cause de ce même problème.

Pour utiliser sur votre site, vous feriez quelque chose comme ceci:

<script src="/path/to/prototype.js"></script> 
<script src="/path/to/jquery.js"></script> 
<script src="/path/to/your/code.js></script> 

... où votre code pourrait ressembler à ceci:

(function() { 
    var $j = jQuery.noConflict(); 
    $j("some-selector").pluginMethod(); // jQuery 
    $("some-id").addClassName("foo"); // Prototype 
})(); 

(Vous n'avez pas besoin la fonction d'emballage là, c'est juste pour éviter de créer un $j global).

Ou tout simplement:

jQuery.noConflict(); 
jQuery("some-selector").pluginMethod(); // jQuery 
$("some-id").addClassName("foo");  // Prototype 

Answer 2

Je pense T.J. Crowder a une bonne réponse, mais comme alternative si vous avez besoin de gérer les conflits, etc., sur l'ensemble de votre projet. Vous pouvez considérer requirejs.

Je n'entrerai pas dans les détails à propos de requirejs, car on peut en trouver beaucoup sur son site.

RequireJS est un chargeur de module pour aider à gérer les problèmes de ce type et dispose de fonctionnalités pour aider avec javascript qui ne respecte pas le asynchronous module pattern.

Voici un article sur son utilisation avec jQuery et les plugins. http://requirejs.org/docs/jquery.html