2010-06-27 7 views
10

J'utilise un script jQuery hoverIntent.js pour un système de menu déroulant méga inspiré de la mega drop down de Son Tonaka avec CSS & jQuery sohtanaka.com/web-design/mega-drop-downs-w -css-jquery. Ma page inclut un script prototype.js qui est inséré par un fournisseur tiers (il s'agit d'un site Web immobilier qui charge le contenu de la recherche de propriétés et de la gestion des pistes). Il charge en dernier juste avant l'étiquette. Mon script de menu et mes appels jQuery sont chargés en haut de la balise. Ci-dessous, j'ai inclus 2 liens. Le premier lien j'ai commenté l'appel à prototype.js et le menu fonctionne bien. Le deuxième lien a l'appel à prototype.js et le menu déroulant ne fonctionne pas.jQuery/prototype conflict

  1. travail déroulant: http://www.myreoforeclosures.com/_menutestfromcode.html (prototype.js commentées)

  2. baisse qui ne travaillent pas vers le bas: http://www.myreoforeclosures.com/_menutestfromcode2.html (avec prototype.js de travail)

J'ai essayé beaucoup de variations des résolutions noConflict() jQuery proposées sur le site Web jQuery, mais pour la vie de moi, je ne peux pas le conflit résolu. J'ai réduit les liens ci-dessus à seulement les bases du CSS et HTML pour tester le menu déroulant.

Veuillez noter que je suis en train de grimper une courbe d'apprentissage abrupte avec Web 2.0/CSS/jQuery, car c'est la première fois que je conçois un site Web utilisant ces outils (par rapport à des sites Web auparavant).

Toute aide pour obtenir le jQuery et le prototype de travailler ensemble serait grandement apprécié. J'ai seulement le contrôle du script jQuery donc toute résolution doit être faite à jQuery. Je n'ai aucun contrôle sur le prototype.js.

+1

Merci de votre aide. J'ai passé de nombreuses heures à chercher une solution à ce problème. C'est le premier endroit où j'ai trouvé de l'aide de qualité par des personnes plus dans le «savoir» que moi. D'autres sites Web semblent répéter les mêmes informations trouvées ici: http://api.jquery.com/jQuery.noConflict/et ici: http://docs.jquery.com/Using_jQuery_with_Other_Libraries. J'ai également contacté le créateur du menu déroulant et le créateur du plugin hoverIntent, mais les deux disent qu'ils sont trop occupés pour aider. Merci encore pour votre aide. Mike –

+0

Dunno pourquoi je ne pensais pas à cela avant, mais je l'ai trouvé dans la console d'erreur de Firefox: Erreur: longueur de tableau invalide Fichier source: http://www.myreoforeclosures.idxco.com/javascript/prototype.js Ligne : 30 –

+0

J'ai oublié de mentionner, cette erreur indique un problème avec quelque chose qui utilise un prototype, pas nécessairement un conflit avec jQuery. Cela peut aussi être un problème avec la bibliothèque de prototypes elle-même (peut-être un bug, problème avec votre copie), même si c'est moins probable. –

Répondre

0
+0

De la question: * "J'ai essayé de nombreuses variantes des résolutions jQuery noConflict() proposées sur le site Web de jQuery" * – user113716

+0

Peut-être pas celle que j'ai suggérée. Comme il ne le mentionne pas nous ne pouvons pas être sûrs donc je pense que ma réponse est toujours valable. – XIII

+1

Mon point est que vous n'avez rien ajouté d'utile puisque l'OP est conscient de 'noConflict()' et ne peut pas le faire fonctionner. Et vous n'avez pas réellement proposé une résolution 'noConflict()'. Vous venez de dire de l'utiliser. – user113716

1

Je vois que vous utilisez une ancienne version de jQuery. Vous avez 1.3.2 au lieu de 1.4.2.

Je ne sais pas si cela ferait une différence, mais peut-être essayer la dernière version.

Vous pouvez créer un lien vers directement de CDN Google:

http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js

+0

J'utilise maintenant 1.4.2 à la fois sur la page qui fonctionne (prototype.js a commenté) et sur la page qui ne fonctionne pas (prototype.js lié). Pas de chance. –

+0

@Mike - Eh bien, le reste de votre jQuery semble fonctionner sans erreur, donc ce n'est probablement pas spécifiquement un problème noConflict. En outre, l'erreur se produit lorsque vos rappels 'megaHoverOver' et' megaHoverOut' sont exécutés. J'ai donc le sentiment que cela n'a rien à voir avec le plugin hoverIntent. Juste pour vérifier, pourriez-vous s'il vous plaît supprimer la configuration de hoverIntent afin qu'elle fonctionne avec juste jQuery afin que nous puissions l'éliminer? – user113716

+0

@patrick - a commenté hoverIntent dans les deux versions- http://www.myreoforeclosures.com/_menutestfromcode-noHI.En supprimant les tue tous les deux - y compris celui w/prototype.js commenté. -BTW apprécier l'aide. –

0

Le menu semble fonctionner pour moi à la fois URL. (Firefox 3.6.4)

Edit: Ils semblent travailler pour moi, parce que mon navigateur préféré est Firefox avec NoScript. Je n'ai pas remarqué que la bibliothèque prototype provenait d'un domaine différent. =/

/headdesk

+0

Merci d'avoir regardé ça Les deux liens produisent un menu déroulant? fonctionne: http://www.myreoforeclosures.com/_menutestfromcode.html parce qu'il n'y a pas d'appel à prototype.js mais cette version ne produit pas de menu déroulant http://www.myreoforeclosures.com/_menutestfromcode.html en raison d'un conflit avec le prototype.js. –

+0

Darn, je n'ai pas remarqué le 2ème domaine Bien sûr, les deux ont fonctionné pour moi, car j'utilise NoScript Désolé Mike, si je l'avais vérifié dans Chrome ou IE Je l'aurais remarqué Ce qui est ironique, c'est que j'ai même vérifié la source des deux pages, pour m'assurer que l'on avait bien commenté le prototype, mais que je n'ai pas remarqué la légère différence dans l'URL de cette bibliothèque de prototypes –

3

Je soupçonne que la raison jQuery.noConflict() ne fonctionne pas est que le code de menu continue à utiliser $ de se référer à la fonctionnalité jQuery. Tout ce noConflict() fait est de délier le nom global de $jQuery.

Si vous avez un code qui attend $ pour signifier "jQuery", alors il doit être modifié pour utiliser jQuery à la place.Sinon, il va prendre le prototype $ qui est bien sûr une chose très différente.

modifier — ok j'ai finalement obtenu votre page à charger (je pense que mon réseau avait des problèmes), je vois que vous utilisez « $ j » assez cohérente. Donc, je ne pense pas que le problème $ dans le code du menu est un problème, mais je vais laisser le commentaire ici, car il est encore vrai que noConflict() n'est pas magique.

modifier à nouveau — j'aller avec la suggestion de Patrick pour essayer Prototype 1.4.2.

+0

Oui je vois ça maintenant ; merci @patrick! – Pointy

+0

Pointy - Désolé, j'ai supprimé mon commentaire après avoir mis à jour votre réponse. ; o) – user113716

+0

Hey @patrick: avez-vous remarqué que l'erreur qui se passe sur la page semble se produire quand quelque chose dans jQuery appelle "shift()" sur quelque chose (probablement un tableau), et cela provoque un saut dans un prototype override d'une méthode native? Je parie que c'est ce que le problème est; C'est en gros un bug jQuery 1.3.2 dans le "Prototype-proofing" de la librairie. – Pointy

0

Si ce menu n'utilise pas de prototype, vous pouvez redéfinir la variable en jQuery dans un nouveau bloc (via une fonction anonyme auto-exécutable).

(function ($) { 
    // do stuff as usual 
})(jQuery); 
+0

le menu utilise uniquement jQuery –

1

J'avais exactement le même problème! J'utilise Jq 1.6.2 et un prototype.js, avec le 'RangeError: Invalid array length'. J'ai presque abandonné jusqu'à ce que j'utilise la copie CDN du prototype de Google, et tout est bon. Je suppose que le bogue qui était en cause a été résolu.

Questions connexes