jquery에서 .html의 버튼이 작동하지 않습니다.

Question

페이지에 단추 두 개를 추가합니다. 첫 번째 버튼을 클릭하면 내용 (다른 버튼 포함)이 사용자에게 표시됩니다. 문제가 있습니다 : 두 번째 버튼이 작동하지 않는이 콘텐츠에 있습니다. 경고가 사용자에게 표시되지 않았습니다.

Demo : http://jsfiddle.net/k5bL7pkj/5/ 

Answer 1

후에.

$('body').on('click', '#ss', function() { 
    alert("TEST"); 
    }); 

항상

Fiddle

Answer 2

이것은 런타임에 요소가 만들어지기 때문에 요소를 만든 후에 이벤트를 추가해야하기 때문입니다.

이 코드를보십시오 :

$(document).ready(function(){ 
    $("#aa").click(function() { 
     var imgUrl = $(this).data('rel'); 
     $("#area").html("<img src='" + imgUrl + "' alt='description' /><button id='ss'>SSSSS</button>"); 

     $('#ss').click(function() { 
      alert("TEST"); 
     }); 

    }); 

}); 

결과 : 그런 다음, 페이지에있는 무언가에 이벤트 핸들러를 첨부 존재할 수있는 요소까지 이벤트를 필터링해야 http://jsfiddle.net/k5bL7pkj/8/

Answer 3

문서에 대한 모든 "를 클릭, 변경 또는의 keyup"함수를 사용하여, 그것은 미래에 도움이 될 것입니다 ...

$(document).on('click','#aa', function() { 
    var imgUrl = $(this).data('rel'); 
    $("#area").html("<img src='" + imgUrl + "' alt='description' /><button id='ss'>SSSSS</button>"); 
}); 

$(document).on('click','#ss', function() { 
    alert("TEST"); 
}); 

: 예