ReferenceError: l'evento non è un errore definito in Firefox

Ho creato una pagina per un cliente e inizialmente lavoravo in Chrome e ho dimenticato di controllare se funzionava in Firefox. Ora, ho un grosso problema perché l'intera pagina è basata su uno script che non funziona in Firefox.

Si basa su tutti i "link" che hanno una relche porta a nascondere e mostrare la pagina giusta. Non capisco perché questo non funziona in Firefox.

Per le pagine esempio hanno l'id #menuPage, #aboutPagee così via. Tutti i collegamenti hanno questo codice:

<a class="menuOption" rel='#homePage' href="#">Velkommen</a> 

Funziona perfettamente in Chrome e Safari.

Ecco il codice:

$(document).ready(function(){

//Main Navigation


$('.menuOption').click(function(){

  event.preventDefault();
  var categories = $(this).attr('rel');
  $('.pages').hide();
  $(categories).fadeIn();


});

// HIDES and showes the right starting menu
    $('.all').hide();
    $('.pizza').show();


// Hides and shows using rel tags in the buttons    
    $('.menyCat').click(function(event){
        event.preventDefault();
        var categori = $(this).attr('rel');
        $('.all').hide();
        $(categori).fadeIn();
        $('html,body').scrollTo(0, categori);

    });


}); 

Stai dichiarando (alcuni) i tuoi gestori di eventi in modo errato:

$('.menuOption').click(function( event ){ // <---- "event" parameter here

    event.preventDefault();
    var categories = $(this).attr('rel');
    $('.pages').hide();
    $(categories).fadeIn();


});

È necessario che "evento" sia un parametro per i gestori. WebKit segue il vecchio comportamento di IE di utilizzare un simbolo globale per "evento", ma Firefox no. Quando utilizzi jQuery, quella libreria normalizza il comportamento e garantisce che ai gestori di eventi venga passato il parametro dell'evento.

modifica - per chiarire: devi fornire un nome di parametro; utilizzando eventrende chiaro ciò che si intende, ma si può chiamare eo cupcakeo qualsiasi altra cosa.

Nota anche che il motivo per cui probabilmente dovresti usare il parametro passato da jQuery invece di quello "nativo" (in Chrome, IE e Safari) è che quello (il parametro) è un wrapper jQuery attorno all'oggetto evento nativo. Il wrapper è ciò che normalizza il comportamento dell'evento nei browser. Se usi la versione globale, non la ottieni.

È perché ti sei dimenticato di passare eventalla clickfunzione:

$('.menuOption').on('click', function (e) { // <-- the "e" for event

    e.preventDefault(); // now it'll work

    var categories = $(this).attr('rel');
    $('.pages').hide();
    $(categories).fadeIn();
});

In una nota a margine, eè più comunemente usato al contrario della parola eventpoiché Eventè una variabile globale nella maggior parte dei browser.