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 รอบ ๆ วัตถุเหตุการณ์ดั้งเดิม Wrapper คือสิ่งที่ปรับพฤติกรรมเหตุการณ์ในเบราว์เซอร์ให้เป็นปกติ หากคุณใช้เวอร์ชันสากลคุณจะไม่เข้าใจ

เป็นเพราะคุณลืมที่จะ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มักใช้มากกว่าคำว่าeventsince Eventเป็นตัวแปรส่วนกลางในเบราว์เซอร์ส่วนใหญ่