ReferenceError : Firefox에서 이벤트가 정의되지 않았습니다.

Question

클라이언트 용 페이지를 만들었는데 처음에 Chrome에서 작업 중이었고 Firefox에서 작동하는지 확인하지 않았습니다. 이제 전체 페이지가 Firefox에서 작동하지 않는 스크립트를 기반으로하기 때문에 큰 문제가 있습니다.

rel이있는 모든 '링크'를 기반으로하며 올바른 페이지를 숨기고 표시합니다. Firefox에서 작동하지 않는 이유를 모르겠습니다.

예를 들어 페이지의 ID는 #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); 

    }); 


}); 

Answer 1

잘못 (일부) 이벤트 핸들러를 선언하고 있습니다 :

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

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


}); 

당신은 핸들러에 매개 변수로 "이벤트"를 필요로 여기

는 코드입니다. 웹킷 (WebKit)은 "이벤트"에 대한 글로벌 심볼을 사용하는 IE의 옛 행동을 따르지만 파이어 폭스는 그렇지 않다. jQuery를 사용할 때 라이브러리는 비헤이비어를 표준화하고 이벤트 핸들러가 이벤트 매개 변수를 전달하도록합니다.

편집 —는 명확히 : 당신이 일부 매개 변수 이름을 제공해야합니다; event을 사용하면 의도 한 바가 명확 해지지 만 e 또는 cupcake 또는 다른 어떤 것으로 부를 수 있습니다.

크롬과 IE 및 Safari에서 "기본"매개 변수 대신 jQuery에서 전달 된 매개 변수를 사용해야하는 이유는이 매개 변수가 기본 이벤트를 둘러싼 jQuery 래퍼라는 점입니다 목적. 래퍼는 브라우저에서 이벤트 동작을 표준화하는 것입니다. 글로벌 버전을 사용하는 경우에는 알 수 없습니다. 당신이 click 함수에 event을 전달하는 것을 잊었다 때문이다

Answer 2

: Event 때문에 단어 event 반대로 보조 노트에

$('.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가 더 일반적으로 사용되는 대부분의 브라우저에서 전역 변수입니다 .