ReferenceError: sự kiện không được xác định lỗi trong Firefox

Tôi đã tạo một trang cho một khách hàng và ban đầu tôi đang làm việc trong Chrome và quên kiểm tra xem nó có hoạt động trong Firefox hay không. Bây giờ, tôi gặp một vấn đề lớn vì toàn bộ trang dựa trên một tập lệnh không hoạt động trong Firefox.

Nó dựa trên tất cả các "liên kết" có reldẫn đến việc ẩn và hiển thị đúng trang. Tôi không hiểu tại sao tính năng này không hoạt động trong Firefox.

Ví dụ, các trang có id #menuPage, #aboutPagev.v. Tất cả các liên kết có mã này:

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

Nó hoạt động hoàn hảo trong Chrome và Safari.

Đây là mã:

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

    });


}); 

Bạn đang khai báo (một số) trình xử lý sự kiện của mình không chính xác:

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

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


});

Bạn cần "sự kiện" là một tham số cho trình xử lý. WebKit tuân theo hành vi cũ của IE là sử dụng biểu tượng chung cho "sự kiện", nhưng Firefox thì không. Khi bạn đang sử dụng jQuery, thư viện đó sẽ chuẩn hóa hành vi và đảm bảo rằng các trình xử lý sự kiện của bạn được truyền tham số sự kiện.

chỉnh sửa - để làm rõ: bạn phải cung cấp một số tên tham số; sử dụng eventlàm cho nó rõ ràng những gì bạn có ý định, nhưng bạn có thể gọi nó là ehay cupcakehoặc bất cứ điều gì khác.

Cũng lưu ý rằng lý do bạn có thể nên sử dụng tham số được truyền vào từ jQuery thay vì tham số "gốc" (trong Chrome và IE và Safari) là tham số đó (tham số) là trình bao bọc jQuery xung quanh đối tượng sự kiện gốc. Trình bao bọc là thứ bình thường hóa hành vi sự kiện trên các trình duyệt. Nếu bạn sử dụng phiên bản toàn cầu, bạn không hiểu được điều đó.

Đó là do bạn quên eventnhập vào clickhàm:

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

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

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

Một lưu ý nhỏ elà , được sử dụng phổ biến hơn so với từ này eventvì Eventlà một biến toàn cục trong hầu hết các trình duyệt.