아약스가 추가 콘텐츠를

Question

작동하지 않는 나는 다음과 같은 자바 스크립트가 있습니다

<script> 
    $(document).ready(function() { 
    $('[class^="commentbubble_"]').click(function() { 
     var ID = $(this).attr('class').replace('commentbubble_', ''); 
     $('.commentform_'+ID).toggle(); 
     $('#commentsection').masonry('reload'); 
    }); 
    }); 
</script> 

그것은 결과의 첫 페이지 작동 ...하지만 새로 추가, 그것은 작동하지 않습니다. 새로 추가 된 콘텐츠에서이 기능을 사용할 수있는 방법이 있습니까?

감사합니다.

Answer 1

당신은 대표단 .on() 핸들러 페이지로드 또는 $(document) 자체에 대한이었다 부모에 이벤트 시도 할 수 있습니다 :

$(document).ready(function() { 
    $(document).on('click', '[class^="commentbubble_"]', function() { 
     var ID = $(this).attr('class').replace('commentbubble_', ''); 
     $('.commentform_'+ID).toggle(); 
     $('#commentsection').masonry('reload'); 
    }); 
}); 

Answer 2

사용 live

('[class^="commentbubble_"]').live ('click', function() {

참고 : live 인을 더 이상 사용되지 않으므로 @Jai가 제안한대로 on을 사용하십시오.

당신은 당신이 바인딩을 필요로하는 요소가 이벤트를 클릭입니다 추가하면

Answer 3

$(). 준비는 현재 요소에서 작동

Answer 4

페이지가로드 후 아약스로드에 데이터를 추가하고 있기 때문에, 그래서 당신은 필요 .on 이벤트 처리기를 사용하여 .click 이벤트 대신 요소의 모든 이벤트를 바인딩하십시오.

구문은 다음과 같습니다, 더 참고로

<script> 
    $(document).ready(function() { 
    $('document).on('click','[class^="commentbubble_"]',function() { 
     var ID = $(this).attr('class').replace('commentbubble_', ''); 
     $('.commentform_'+ID).toggle(); 
     $('#commentsection').masonry('reload'); 
    }); 
    }); 
</script> 

http://api.jquery.com/on/