2011-10-12 5 views
0

테이블 행별로 구성된 동적 양식을 작성하려고합니다. 사용자가 +를 클릭 할 때마다 새로운 입력 행이 삽입됩니다. 단순화하기 위해, 나는 코드를 요약 된했습니다새로 추가 된 객체의 이벤트를 수신하는 jquery

<table id="test"> 
<tr> 
    <td> 
     <a class="addrow" href="javascript:void(0);">+</a> 
    </td> 
</tr> 
</table> 
<script> 
$('.addrow').click(function() { 
    $("#test tr:last").after('<tr><td><a class="addrow" href="javascript:void(0);">+</a></td></tr>'); 
}); 
</script> 

내 질문은 첫 번째 + 스크립트를 실행하는 것, 그리고 새로 삽입 할 때 +의 클릭 할 아무 일도 발생하지 않습니다. 이것은 jquery가 새로 추가 된 객체의 이벤트를 제대로 듣지 않아서 발생하는 것으로 생각됩니다.

$ (document) .ready (function() {})을 추가하려고했습니다. 작은 운이.

도움을 주시면 감사하겠습니다. 사전에

감사합니다,

답변

1

을 볼 수 있습니다 확실하지

$('.addrow').live('click',function(){ /* click handler in here */ }) 

또는 delegate()과 : 이벤트가 결합 된 때 DOM에 존재하지 않는 요소, 당신은 live() 또는 delegate()를 사용해야합니다

$('#table').delegate('.addrow','click',function(){ /* click handler in here */ }); 

참고 :

+0

감사합니다. 이것은 많은 도움이되었습니다! – rickypai

+0

당신은 절대적으로 환영합니다! 도와 줘서 다행 이네요, 받아 들일 수있는 것에 대해 감사드립니다. =) –

0

내가 질문을 이해하지만, 당신이 이벤트에 반응하려는 당신이, 이벤트가 DOM로드 이후에 추가 요소를 살 사용하여 바인딩 http://api.jquery.com/live/

0

사용 :

$('.addrow').live('click', function() { 
    $("#test tr:last").after('<tr><td><a class="addrow" href="javascript:void(0);">+</a></td></tr>'); 
}); 

는 도움을합니까?

관련 문제