2012-12-28 3 views
0

이 내 HTML 코드입니다 :내 Jquery 코드는 한 번만 작동합니까?

<a href="#" class="menu_item"><img src="Home-48.png" alt="education" /></a> 
<br /><br /> 
<a href="#" class="menu_item"><img src="Shield_48.png" alt="education" /></a> 
<br /><br /> 
<a href="#" class="menu_item"><img src="Education-48.png" alt="education" /></a> 
<br /><br /> 
<a href="#" class="menu_item"><img src="Money-Bag-48.png" alt="education" /></a> 

이 내 jQuery 코드입니다 : 내가 원하는

$(document).ready(function(){ 
    $('.menu_item1').click(function(){ 
     $('#custom_menu_loading_section').fadeIn(800, function(){ 
      $('#custom_menu').load('education.html', {}, function() { $("#accordion").accordion({ heightStyle: "fill" }); }); 
     }); 
    }); 
}); 

이 나는 ​​$("#custom_menu")으로 이미지에 education.html로드를 클릭 만하면 한 번만 작동합니다. 예를 들어 첫 번째 이미지를 클릭하면 올바르게 작동하지만 두 번째 이미지를 클릭하면 작동하지 않습니다. 왜?


내 목표 : 전 메뉴 항목을 갖고 싶어 (exapmle 가정을 소개, 연락처, ...) 사용자가 JQuery와 부하, 거기에 외부 파일 (집의 내용을 클릭 할 때. html, about.html, ...)을 "#custom_menu"에 추가하여 "#custom_menu_loading_section"로드 효과를 표시합니다.

+0

오타를 당신의 자바 스크립트? 나는'$ ('. menu_item1') ... '을 보았지만, 당신의 HTML – giorgio

답변

1

클릭 대신 Live을 시도하십시오. 문서에서

:

는 현재와 미래, 현재 셀렉터에 일치하는 모든 요소에 대한 이벤트 처리기를 연결합니다. JQuery와 팀

+2

라이브에서는'class = "menu_item"'도 사용되지 않습니다. 대신'on'을 사용하십시오. – sethvargo

+0

@sethvargo 네, 맞습니다. 내 잘못이야. – WooCaSh

0

참고 :

jQuery.fn.live()는 지원되지 않습니다; 그들의 성능 및 유용성 단점에 .live()와 .die() 메소드가 1.7에서 사용되지 않는, 그리고 더 이상 지원됩니다 jQuery.fn.die는()

원인이되지 않습니다.

해결 방법 : .on() 또는 .delegate()를 사용하여 .live() 호출을 다시 작성하십시오. 이렇게하는 방법은 .live() API 설명서에 나와 있습니다.

그래서 대신를 사용

$(document).ready(function() { 
    $(document).on('click', '.menu_item1', function() { 
      // do something 
    }); 
}); 
관련 문제