ReferenceError: acara tidak didefinisikan kesalahan di Firefox

Saya telah membuat halaman untuk klien dan saya awalnya bekerja di Chrome dan lupa untuk memeriksa apakah itu berfungsi di Firefox. Sekarang, saya punya masalah besar karena seluruh halaman didasarkan pada skrip yang tidak berfungsi di Firefox.

Ini didasarkan pada semua "link" relyang mengarah ke persembunyian dan menampilkan halaman yang benar. Saya tidak mengerti mengapa ini tidak berfungsi di Firefox.

Misalnya halaman memiliki id #menuPage, #aboutPagedan seterusnya. Semua tautan memiliki kode ini:

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

Ini bekerja dengan sempurna di Chrome dan Safari.

Ini kodenya:

$(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);

    });


}); 

Anda menyatakan (beberapa) penangan acara Anda secara tidak benar:

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

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


});

Anda membutuhkan "peristiwa" untuk menjadi parameter bagi penangan. WebKit mengikuti perilaku lama IE dalam menggunakan simbol global untuk "acara", tetapi Firefox tidak. Saat Anda menggunakan jQuery, pustaka itu menormalkan perilaku dan memastikan bahwa penangan peristiwa Anda diteruskan parameter peristiwa.

edit - untuk memperjelas: Anda harus memberikan beberapa nama parameter; menggunakan eventmemperjelas apa yang Anda inginkan, tetapi Anda dapat menyebutnya eatau cupcakeatau apa pun.

Perhatikan juga bahwa alasan Anda mungkin harus menggunakan parameter yang diteruskan dari jQuery daripada yang "asli" (di Chrome dan IE dan Safari) adalah karena parameter tersebut (parameter) adalah pembungkus jQuery di sekitar objek acara asli. Wrapper inilah yang menormalkan perilaku event di seluruh browser. Jika Anda menggunakan versi global, Anda tidak mengerti.

Itu karena Anda lupa masuk eventke clickfungsinya:

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

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

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

Di samping catatan, elebih umum digunakan sebagai lawan kata eventkarena Eventmerupakan variabel global di sebagian besar browser.