Étiquette : conflit

[jQuery] Conflits, message d’erreur « $ is not a function » et corrections possibles

En jQuery, l’appel d’une fonction se fait en général de la manière suivante :

L’objet $ est utilisé par jQuery en tant que récupérateur de fonctions, et le script sait quelle librairie appeler. Problème : si vous utilisez d’autres librairies qui utilisent aussi le dollar comme objet par défaut (Prototype, Scriptaculous dans Magento par exemple…), vous obtiendrez potentiellement des conflits et un message d’erreur de type $ is not a function !

Solution 1 :

Utiliser la fonction jQuery.noConflict(); et créer une fonction anonyme. Source : jquery – is not a function error.

Solution 2 :

Remplacer tous les $ par un alias jQuery afin de réassigner toutes les variables de l’objet $ à ce dernier. Source : « $ is not a function » dans JQuery – La solution.

[Magento] Résoudre le conflit de dropdown entre Bootstrap 3 et PrototypeJS

Source : Resolve the conflict between Bootstrap 3 and PrototypeJS
.

Composants Bootstrap affectés :

  • Collapsible components useful for building accordion and navigation.
  • Dropdown menus : quand le menu se ferme, il disparaît entièrement.
  • Modal dialogs
  • Tootips

Solution sans chargement des librairies JavaScript via CMD :

Source : http://jsfiddle.net/dgervalle/hhBc6/.

Solution avec chargement des librairies JavaScript via CMD :

Source : http://jsfiddle.net/dgervalle/e8Apv/.

[JQuery] J’ai mis jQuery à jour et la fonction .live() ne fonctionne plus. Méthode de migration.

UPDATE : jquery-migrate – Migrate older jQuery code to jQuery 1.9+.

Sources : http://stackoverflow.com/questions/14354040/jquery-1-9-live-is-not-a-function | http://stackoverflow.com/questions/14703646/jquery-how-to-use-the-on-method-instead-of-live/14703668#14703668

A lire avant que vous n’entrepreniez un Rechercher et Remplacer automatique:

Pour une migration rapide sur un site en production, ne vous contentez pas d’un remplacement automatique du mot-clé live par on, car les paramètres des deux fonctions sont différents :

devrait devenir :

La présence du sélecteur est très importante! Si vous n’avez pas besoin de l’utiliser, déclarez le comme null.


Migration Example 1:

Avant :

Après, il faut déplacer l’élément enfant (a) sur le paramètre selector de la fonction .on() :


Migration Example 2:

Avant :

Après, il faut déplacer l’élément (.myButton) sur le paramètre selector de la fonction .on(), et cible l’élément parent le plus proche (de préférence un ID) :

Si vous ne savez pas quoi mettre comme élément parent, body fonctionne toujours :


Migration Example 3 :

Avant :

Après :