ReferenceError: событие не определено error в Firefox

Я сделал страницу для клиента, и сначала я работал в Chrome и забыл проверить, работает ли она в Firefox. Теперь у меня большая проблема, потому что вся страница основана на script, который не работает в 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);

    });


});

Ответы

Ответ 1

Вы неправильно объявляете (некоторые из) обработчиков событий:

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

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


});

Для обработчиков вам нужно "event". WebKit следует за старым поведением IE использования глобального символа для "события", но Firefox этого не делает. Когда вы используете jQuery, эта библиотека нормализует поведение и гарантирует, что обработчики событий передаются параметром события.

edit — для уточнения: вы должны указать имя параметра; используя event, дает понять, что вы намереваетесь, но вы можете назвать его e или cupcake или что-то еще.

Обратите внимание также, что причина, по которой вы, вероятно, должны использовать параметр, переданный из jQuery вместо "родной" (в Chrome и IE и Safari), состоит в том, что этот параметр (параметр) является оберткой jQuery вокруг собственного объекта события, Обертка - это то, что нормализует поведение событий в браузерах. Если вы используете глобальную версию, вы не получите этого.

Ответ 2

Это потому, что вы забыли пройти в 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 является глобальной переменной в большинстве браузеров.

Ответ 3

хорошо, прежде чем делать все это, сотрудники делают это, чтобы понять, в чем ваша проблема

$ ('. menuOption'). click (функция (событие) {

 console.log('firefox looks like shit');

});