함수에 새로 추가 된 클래스가 표시되지 않습니다.

Question

마우스 오버시 텍스트 색상을 페이드 인하거나 페이드 아웃하는 탐색 기능이 있습니다. 이것은 비활성 클래스를 기반으로합니다.

처음에는 활성화 된 페이지를 제외하고 완벽하게 작동합니다.

내가 아약스를 통해 페이지를 변경하면 이전에 '활성'이었던 요소에 '비활성'클래스를 추가하지만 내 함수는이를 인식하지 못합니다. 웹 관리자에서 활성 클래스가 제거되고 비활성 클래스가 올바르게 추가 된 것을 볼 수 있습니다. 어떤 제안?

('header#primary nav a.inactive').hover(
    function(){ 
     $(this).stop().animate({'color': '#ffffff'}, 'slow'); 
    }, 
    function() { 
     $(this).stop().animate({'color': '#a2a2a2'}, 'slow'); 
    }); 

Answer 1

당신은 동적으로 추가 요소 JQuery와 live 기능을 사용해야합니다.

$('header#primary nav a.inactive').live('mouseenter' ,function(){ 
      $(this).stop().animate({'color': '#ffffff'}, 'slow'); 
     }).live('mouseleave', 
     function() { 
      $(this).stop().animate({'color': '#a2a2a2'}, 'slow'); 
     }); 

http://api.jquery.com/live/

Answer 2

짧은 대답은 : 대신 .live() 또는 .delegate() 기능을 사용합니다. jQuery doco는 어떻게 작동하는지에 대한 설명을 제공하며 hover() 단축키 대신 mouseenter() 및 mouseleave() 조합을 사용해야하는 유일한 딸꾹질이 있습니다.

중간 답 :

말한다

$('header#primary nav a.inactive').hover(/* your code */); 

"는 DOM을 모두 찾을 수 있습니다 : 당신이 당신의 코드와 같은 직접 jQuery를 선택에 따라, (호버은, 무엇이든 클릭 여부) 이벤트 핸들러를 할당

셀렉터 과 일치하는 요소는이며 여기에 이벤트 핸들러 (마우스 오버)가 지정됩니다. " 앞으로 선택기와 일치하도록 요소가 변경 될 수있는시기가 없으며 더 이상 일치하지 않게 요소가 변경되면 요소에서 핸들러를 제거하지 않습니다.

대신 당신은 지금 또는 미래에를 셀렉터에 일치하는 요소에 대한 이벤트를 처리 할, .live() 또는 .delegate()을 사용하고 싶습니다.

긴 답변 : oops,이 글을 쓸 시간이없고 실제로 .live()과 .delegate()이 jQuery doco에서 어떻게 다뤄지는지 설명 할 필요가 없습니다.