ReferenceError: подія не визначена помилкою в Firefox

Я створив сторінку для клієнта, і спочатку я працював у Chrome і забув перевірити, чи працює він у Firefox. Тепер у мене є велика проблема, оскільки вся сторінка заснована на сценарії, який не працює у Firefox.

Він базується на всіх "посиланнях", relякі ведуть до приховування та показу потрібної сторінки. Я не розумію, чому це не працює у Firefox.

Наприклад сторінки мають ідентифікатор #menuPage, #aboutPageі так далі. Усі посилання мають цей код:

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

Він прекрасно працює в Chrome і Safari.

Ось код:

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

    });


}); 

Ви декларуєте (деякі) обробники подій неправильно:

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

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


});

Вам потрібен "подія", щоб бути параметром для обробників. WebKit дотримується старої поведінки IE щодо використання глобального символу для "події", але Firefox цього не робить. Коли ви використовуєте jQuery, ця бібліотека нормалізує поведінку та забезпечує, щоб ваші обробники подій передавали параметр події.

правити - уточнити: ви повинні надати деякий ім'я параметра; використовуючи eventпрояснює те , що ви збираєтеся, але ви можете назвати це eабо cupcakeабо що - небудь ще.

Зауважте також, що причина, ймовірно, ви повинні використовувати параметр, переданий з jQuery замість "рідного" (у Chrome, IE та Safari), полягає в тому, що цей (параметр) - оболонка jQuery навколо нативного об'єкта події. Обгортка - це те, що нормалізує поведінку подій у веб-переглядачах. Якщо ви використовуєте глобальну версію, ви цього не отримуєте.

Це тому, що ви забули перейти eventдо clickфункції:

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

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

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

Зі сторони, eчастіше використовується на відміну від слова, eventоскільки Eventє глобальною змінною у більшості браузерів.