Fancybox non funziona con jQuery v1.9.0 [f.browser non è definito / Impossibile leggere la proprietà "msie"]


100

Fancybox rompe con il nuovo jQuery v1.9.0.

Colpisce sia Fancybox v1.3.4 e precedenti - sia - v2.1.3 e precedenti.

Gli errori visualizzati sono:

v1.3.4:

Timestamp: 15/01/2013 10:03:28 AM
Error: TypeError: b.browser is undefined
Source File: ...fancybox/jquery.fancybox-1.3.4.pack.js
Line: 18

... altri errori

Uncaught TypeError: Cannot read property 'msie' of undefined jquery.fancybox-1.3.4.pack.js:18
Uncaught TypeError: Object [object Object] has no method 'fancybox'

Nella v2.1.3:

Timestamp: 15/01/2013 10:09:58 AM
Error: TypeError: $.browser is undefined
Source File: h.../fancybox2.1.3/jquery.fancybox.js
Line: 139

Se lo stai usando per chiamare jQuery:

<script src="http://code.jquery.com/jquery-latest.js"></script>

... qualsiasi implementazione di fancybox esistente fallirà !!


27
Ed è per questo che non dovresti mai, mai usare jquery-latest.jsin produzione!
jrummell

1
usa l'ultima versione di fancybox 2.1.5 fancyapps.com/fancybox
Mukesh

Risposte:


199

Sembra che esista un bug in jQuery riportato qui: http://bugs.jquery.com/ticket/13183 che interrompe lo script Fancybox.

Controlla anche https://github.com/fancyapps/fancyBox/issues/485 per ulteriori riferimenti.

Come soluzione alternativa, eseguire il rollback a jQuery v1.8.3 mentre il bug di jQuery è corretto o Fancybox è patchato.


AGGIORNAMENTO (16 gennaio 2013): Fancybox v2.1.4 è stato rilasciato e ora funziona bene con jQuery v1.9.0.

Per fancybox v1.3.4, è ancora necessario eseguire il rollback a jQuery v1.8.3 o applicare lo script di migrazione come indicato dalla risposta di @ Manu.


AGGIORNAMENTO (17 gennaio 2013): Soluzione alternativa per gli utenti di Fancybox v1.3.4 :

Applicare la patch al file js fancybox per farlo funzionare con jQuery v1.9.0 come segue:

  1. Apri il file jquery.fancybox-1.3.4.js (versione completa, non versione pack ) con un editor di testo / html.
  2. Trova intorno alla riga 29 dove dice:

    isIE6 = $.browser.msie && $.browser.version < 7 && !window.XMLHttpRequest,

    e sostituirlo con ( MODIFICATO 19 marzo 2013: filtro più accurato):

    isIE6 = navigator.userAgent.match(/msie [6]/i) && !window.XMLHttpRequest,

    UPDATE (19 marzo 2013): sostituire anche $.browser.msieda navigator.userAgent.match(/msie [6]/i)attorno alla riga 615 (e / o sostituire tutti i $.browser.msiecasi, se ce ne sono), grazie joofow ... il gioco è fatto!

Oppure scarica la versione già patchata da QUI (AGGIORNATO 19 marzo 2013 ... grazie Fairylee per aver sottolineato la parentesi di chiusura extra)

NOTA : questa è una patch non ufficiale e non è supportata dall'autore di Fancybox, tuttavia funziona così com'è. Puoi usarlo a tuo rischio;)

Facoltativamente, puoi piuttosto eseguire il rollback a jQuery v1.8.3 o applicare lo script di migrazione come indicato dalla risposta di @ Manu.


1
Ho riscontrato lo stesso problema dopo aver estratto dalla CDN dell'API di Google Ajax Libraries su ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js . Questo tira l'ultima versione di jQuery di 1.9.0 e il problema si presenta. Abbiamo rimosso la versione v1.8.3 e l'abbiamo puntata sul server web locale e ora tutto è stato risolto. Ovviamente, vorremmo utilizzare il CDN ma non a scapito di rompere i nostri cursori e i menu al passaggio del mouse.
JPC

Perché è scritta la regex /msie [6]/i? - La classe di caratteri [6]è esattamente equivalente al carattere 6 , cioè senza le parentesi. Ciò non ispira molta fiducia nel codice…: /
zrajm

1
@ZrajmCAkfohg: immagino perché normalmente convalido le versioni di IE dalla 6 alla 8 [6-8]e in questo caso è andata come [6], alla fine è solo una convenzione di sintassi. Ad ogni modo, se sono "esattamente equivalenti", allora in che modo ciò influisce sulla fiducia nel codice?!?! Se il risultato con o senza parentesi fosse diverso e questo lascia spazio alla confusione, allora sarei d'accordo con te, altrimenti non vedo il tuo commento "... non ispira fiducia ..." molto costruttivo. Preferirei incoraggiarti a pubblicare la tua risposta "che ispira fiducia".
JFK

1
Tuttavia, questo non risolve il problema con l'apertura di FancyBox una seconda volta ... Vedi questa pagina di esempio qui: wasen.net/testjq1.10.2.html
Anders

1
@basZero: quelli sono problemi completamente diversi. Per quello che descrivi controlla groups.google.com/forum/#!topic/fancybox/-re22BoXOzM se questo aiuta
JFK

28

Salve, questo è dovuto alla nuova versione di jQuery => 1.9.0

puoi controllare l'aggiornamento: http://blog.jquery.com/2013/01/15/jquery-1-9-final-jquery-2-0-beta-migrate-final-released/

jQuery.Browser è deprecato. puoi mantenere l'ultima versione aggiungendo uno script di migrazione: http://code.jquery.com/jquery-migrate-1.0.0.js

sostituire:

<script src="http://code.jquery.com/jquery-latest.js"></script>

di:

<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.0.0.js"></script>

nella tua pagina e nel suo funzionamento.


+1 Interessante. In ogni caso, dobbiamo tutti modificare i nostri sistemi per eseguire la versione di rollback o applicare la patch per il codice legacy.
JFK

L'applicazione della patch (jquery-migrate) non aiuta a risolvere questo problema con fancybox-1.3.4, jquery-1.11.3 e jquery-migrate-1.2.1 ... Esistono soluzioni di patch a questo problema senza la necessità di aggiornare al Fancybox2 non gratuito?
basZero

19

Anche gli eventi globali sono deprecati.

Ecco una patch, che risolve i problemi del browser e degli eventi:

--- jquery.fancybox-1.3.4.js.orig   2010-11-11 23:31:54.000000000 +0100
+++ jquery.fancybox-1.3.4.js    2013-03-22 23:25:29.996796800 +0100
@@ -26,7 +26,9 @@

        titleHeight = 0, titleStr = '', start_pos, final_pos, busy = false, fx = $.extend($('<div/>')[0], { prop: 0 }),

-       isIE6 = $.browser.msie && $.browser.version < 7 && !window.XMLHttpRequest,
+       isIE = !+"\v1",
+       
+       isIE6 = isIE && window.XMLHttpRequest === undefined,

        /*
         * Private methods 
@@ -322,7 +324,7 @@
            loading.hide();

            if (wrap.is(":visible") && false === currentOpts.onCleanup(currentArray, currentIndex, currentOpts)) {
-               $.event.trigger('fancybox-cancel');
+               $('.fancybox-inline-tmp').trigger('fancybox-cancel');

                busy = false;
                return;
@@ -389,7 +391,7 @@
                        content.html( tmp.contents() ).fadeTo(currentOpts.changeFade, 1, _finish);
                    };

-                   $.event.trigger('fancybox-change');
+                   $('.fancybox-inline-tmp').trigger('fancybox-change');

                    content
                        .empty()
@@ -612,7 +614,7 @@
            }

            if (currentOpts.type == 'iframe') {
-               $('<iframe id="fancybox-frame" name="fancybox-frame' + new Date().getTime() + '" frameborder="0" hspace="0" ' + ($.browser.msie ? 'allowtransparency="true""' : '') + ' scrolling="' + selectedOpts.scrolling + '" src="' + currentOpts.href + '"></iframe>').appendTo(content);
+               $('<iframe id="fancybox-frame" name="fancybox-frame' + new Date().getTime() + '" frameborder="0" hspace="0" ' + (isIE ? 'allowtransparency="true""' : '') + ' scrolling="' + selectedOpts.scrolling + '" src="' + currentOpts.href + '"></iframe>').appendTo(content);
            }

            wrap.show();
@@ -912,7 +914,7 @@

        busy = true;

-       $.event.trigger('fancybox-cancel');
+       $('.fancybox-inline-tmp').trigger('fancybox-cancel');

        _abort();

@@ -957,7 +959,7 @@
            title.empty().hide();
            wrap.hide();

-           $.event.trigger('fancybox-cleanup');
+           $('.fancybox-inline-tmp, select:not(#fancybox-tmp select)').trigger('fancybox-cleanup');

            content.empty();

4
Solo con le istruzioni di patch dalla risposta di JFK ho avuto ancora problemi quando ho provato ad aprire una casella in linea una seconda volta, mostrando sempre il messaggio di errore "Impossibile caricare il contenuto richiesto. Riprova più tardi." invece del contenuto, che è stato visualizzato correttamente al primo tentativo. Usando le tue (non così ovvie) patch aggiuntive finalmente funziona.
Gurken Papst

1
Ho appena provato questa soluzione con jQuery 1.10.2 e sembra funzionare. Anche se sono anche d'accordo, non è ovvio capire la "patch" in questa risposta.
Daze

Questa è un'ottima soluzione per chiunque sia bloccato con una vecchia versione di Fancybox che necessita di una nuova versione di JQuery. Risolti alcuni bug che mi lasciavano perplessi.
glenatron

4
Se qualcuno ha problemi ad applicare la patch, ecco il file con le modifiche: pastebin.com/9R2VFVBQ
dloewen

4

Nel caso in cui qualcuno debba ancora supportare la legacy fancybox con jQuery 3.0+, ecco alcune altre modifiche che dovrai apportare:

.unbind () deprecato

Sostituisci tutte le istanze di .unbindcon.off

.removeAttribute () non è una funzione

Cambia le righe 580-581 per usare .removeAttr()invece jQuery :

Vecchio codice:

580: content[0].style.removeAttribute('filter');
581: wrap[0].style.removeAttribute('filter');

Nuovo codice:

580: content.removeAttr('filter');
581: wrap.removeAttr('filter');

Questo combinato con l'altra patch menzionata sopra ha risolto i miei problemi di compatibilità.


Come risolveresti questa affermazione? b.showNavArrows? ((b.cyclic && 1 <h.length || 0! == s) && y.show (), (b.cyclic && 1 <h.length || s! = h.length-1) && z.show ( )) :( y.hide (), z.hide ())}, M = funzione () {a.support.opacity || (p.get (0) .style.removeAttribute ( "filtro"), f. get (0) .style.removeAttribute ("filter"))
Bussa X
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.