web-dev-qa-db-fra.com

Fancybox n'est pas une fonction

Bonjour, j'utilise la fancybox du plugin jQuery pour afficher les cartes Bing lorsque quelqu'un entre une adresse dans une zone de texte et clique sur le bouton Envoyer à côté. Et une fancybox est chargée et une carte pour cette adresse s'affiche. Cela fonctionne bien avec mon application, mais le problème est que cela ne fonctionne que sur une page et sur l'autre, lorsque je la charge, cela me donne une erreur disant que fancybox n'est pas une fonction. Je peux voir cette erreur dans la console d'erreur et dans la console Firebug. Je ne sais pas quel pourrait être le problème. Le même code fonctionne dans une autre page, mais pas sur celle-ci?

$("<a href=\"#showmap\">Map</a>").fancybox is not a function

Je suis sûr que ce n'est pas un problème de réutilisation. Mais quand je teste pour voir si les fichiers originaux de fancybox ont été chargés, ils sont chargés avec le dom, donc ce n'est peut-être pas un problème réel. Mais je ne peux pas comprendre quel pourrait être le problème.

C'est mon code

abbr: est juste un bit de texte. J'ai différents divs en fonction de ce que l'utilisateur sélectionne. Et chaque div aurait ses propres contrôles, qui commenceraient par ce texte et seraient accompagnés de leurs propres définitions telles que mapresults, decValLat, decValLon etc.

ex: abbr >> east puis les identifiants seraient eastmapresults, eastdecValLat, eastdecValLon etc.

function showMapFancybox(abbr){
    var abbr;
    $('#'+abbr+'mapresults').hide(); 
    $('<a href="#showmap">Map</a>').fancybox({
        overlayShow: true,
        onClosed: function() {
            $('#'+abbr+'mapresults').show();
            map_latdec = $('#decValLat').attr('value');
            map_longdec = $('#decValLon').attr('value');
            map_latdeg = $('#degValLat').attr('value');
            map_longdeg = $('#degValLon').attr('value');

            $('#'+abbr+'decValLatsub').val(map_latdec);
            $('#'+abbr+'decValLonsub').val(map_longdec);
            $('#'+abbr+'degValLatsub').val(map_latdeg+'N');
            $('#'+abbr+'degValLonsub').val(map_longdeg+'W');
        }
    }).click();    
};
javascriptjqueryhtmljquery-pluginsfancybox
26
macha

J'ai déjà eu ce type d'erreurs car je rechargeais jQuery après l'importation du plugin, vérifiez que vous ne réimportez pas jquery par erreur (parfois inclus dans un package comme les outils jQuery).

61
Guillaume86

Je viens d'avoir ce problème, il semble que certaines versions de jQuery ne soient pas compatibles avec les versions de FancyBox, par exemple Fancybox 1.3.4 est bogué avec les versions de jQuery inférieures à 1.7 et ne fonctionne pas sur les versions supérieures à 1.8.

7
Wyck

Vous devez charger les extensions comme easing.js et mousewheel.js AVANT le plugin principal de fancybox. Cela résout le problème.

3
doublejosh

Si "fancybox" en tant que fonction n'existe pas, il est probable que la source jQuery ou la source du plugin ne parviennent pas à se charger dans votre page. Assurez-vous que le chemin, les noms de fichiers et l'extension sont tous corrects.

EDIT: Assurez-vous de vous lier à jQuery Source avant de vous lier à des plugins. Si un plugin est chargé dans votre code HTML avant jQuery, le plugin échoue.

2
Moses

Dans mon cas, c'était jQuery.noConflict (); ligne dans un autre plugin jQuery ... quand j'ai supprimé tout a commencé à fonctionner.

1
Uli

Solutions possibles:

1) avez-vous déjà chargé jQuery? Sinon, chargez-le avant le début de toute commande $.

2) Vérifiez, vous chargez probablement la bibliothèque jquery (.js) plusieurs fois pendant la page. Essayez d'en charger un seul.

3) À la fin du fichier, vous pouvez exécuter cette commande javascript: $ = jQuery.noConflict(); et cela pourrait résoudre. Sinon, utilisez n'importe où le mot jQuery au lieu de $, et cela fonctionnera aussi.

1
T.Todua

J'ai rencontré ce problème sur mon WordPress et j'ai constaté que le problème se produisait en raison de fancybox.js présentant deux fois dans le code de deux plugins que j'ai installés. Vérifiez donc votre code et assurez-vous de charger à partir d'une seule source.

0
Shanaka

Si vous utilisez un plugin qui inclut JQuery dans votre balise d'en-tête, ce problème peut survenir. J'ai récemment ajouté "TheThe Slider" à mon blog, toutes mes FancyBox ont cessé de fonctionner. Il existe cependant des solutions faciles à cette situation. en gros, allez dans le répertoire du plugin, recherchez l'appel à jquery et rendez son utilisation conditionnelle. Si vous souhaitez voir ma mise en œuvre de ce que j'ai fait blog à ce sujet avec capture d'écran.

0
GRY