jquery 동적 단추 용 선택기가 작동하지 않는 .on() 메서드

Question

페이지에 동적으로 단추를 추가하는 코드가 있습니다.

<a href=“#1" class="btn btn-default next">Next</a> 

selector 매개 변수와 함께 .on() 메서드를 사용하고 있는데 버튼을 클릭해도 아무런 변화가 없습니다. 다른 사람들도 동적으로 추가 된 요소에 대해 비슷한 문제가 있음을 알았지 만 선택기가 누락되어 해결 된 것으로 보입니다.

$(".next").on("click", ".next", function() { 

    alert(“next page"); 

}); 

로드 할 때 페이지의 본문에 단추를 넣었습니다. 나중에 페이지에 추가되면 작동하지 않습니다.

Answer 1

변경

$(".next").on("click", ".next", function() {

$(document).on("click", ".next", function() {

동적이 버블 링 이벤트에 도움이되도록 자식 요소에 이벤트를 위임 할 문서를 사용하여 요소를 생성하기 때문에에 문서 수준.

Answer 2

ancestor은 html에서 버튼의 조상을 선택했다고 가정 해 보겠습니다. 그 다음 :

$(ancestor).on("click", ".next", function() { 
    alert("I have clicked on the button"); 
}); 

이 부분이 실행될 때 버튼이 없어도 작동합니다. 조상에 대해 더 구체적인 내용이 없다면 "body"을 사용할 수 있습니다.

Answer 3

이

당신은 HTML

function myFunction() 
 
{ 
 
    alert("hello"); 
 
}

<button onclick="myFunction()">Click me</button>

의 OnClick 속성을 사용하여 문서 또는 신체

$(document).on("click",".next", function() { 
alert('button clicked'); 
}); 

Answer 4

사용을 사용할 수 있습니다 시도