jquery 메서드가 작동하지 않습니다.

Question

1.7.2 메서드에서 jquery를 사용하려고하는데 문제가 있습니다.

나는이

$(function(){ 
$("a").on("click",'.displayBig', function(e) { 
    e.preventDefault(); 
    alert('foo'); 
})}); 
<a href="images/large_4.jpg" class="displayBig" data="gallery0"><div id="magnify">dsfsfdsfs</div></a>​ 

을 사용하고 나의 선택이 작동하지 않는 것 같습니다.

여기 jsfiddle을 만들었습니다.

http://jsfiddle.net/BQDvM/

감사합니다 얘들 아. 당신은 단지 A-태그를 선택해야 할 경우

Answer 1

당신이 .on()의 동적 버전을 사용하고 싶은 경우에, 당신이 필요로하는

$(staticParentSelector).on('click', '.displayBig', fn); 

staticParentSelector이 dynami의 부모를 가리키는 선택해야합니다 :이 양식을 사용하는 c 개체를 포함하며 위의 jQuery를 실행하여 이벤트 처리기를 설치할 때 존재하며 이벤트 처리기를 설치 한 후에는 삭제되지 않고 다시 만들어지지 않는 개체 여야합니다. 두 번째 선택기 (동적 선택기라고도 함)와 일치하는 개체는 처음에는 존재할 필요가 없으며 나중에 언제든지 만들 수 있습니다.

최악의 경우

,이 일 수 있었다 다음 document 목적을 만족하기 때문에

$(document).on('click', '.displayBig', fn); 

정적 부모에 대한 모든 조건. 그러나 실제 동적 객체에 훨씬 더 가까운 정적 부모를 선택하고 모든 동적 이벤트에 document 객체를 사용하지 않으면 이벤트가 더 잘 수행됩니다. 이 같은 HTML이 있다면

그래서, 그런 다음

<div id="container"> 
    <a href="images/large_4.jpg" class="displayBig" data="gallery0"> 
     <div id="magnify">dsfsfdsfs</div> 
    </a> 
</div> 

,이 같은 .on()의 동적 버전을 사용 :

$("#container").on('click', '.displayBig', fn); 

.on() 작품의 동적 버전이다 방법 단일 이벤트 핸들러를 정적 오브젝트에 바인드합니다. 그런 다음 사용자가 동적 객체 중 하나를 클릭하면 클릭에 대한 객체에 대한 직접 이벤트 핸들러가 없으므로 클릭이 상위 객체 위로 비칠 것입니다. 이벤트 처리기가있는 staticParent 개체에 이벤트가 도착하면 동적 이벤트 처리기가 설치되어 있는지 확인하고 이벤트를 생성 한 개체를 동적 선택기와 비교합니다. 일치하면 이벤트 핸들러를 시작합니다. 일치하지 않으면 이벤트가 시작되지 않습니다.

Answer 2

또는, 당신은 사용할 수 있습니다

$(function(){ 
    $('a.displayBig').on("click", function(e) { 
     e.preventDefault(); 
     alert('foo'); 
    }); 
}); 

http://jsfiddle.net/BQDvM/2/