도전

$(function() {
    $(".myclass").click(function() {
        // Do something
    });
});

$(function() {
    $(".myclass").click(function() {
        // Do something
    });
});

$ (function () { $ ( ". myclass"). 클릭 (function () { // 무언가를합니다 }); });

이 코드는 ".myclass"클래스를 사용하여 기존 요소에 적합하지만 Ajax 또는 동적으로 생성 된 html과 같은 동적 작업을 통해 이벤트 핸들러를 첨부하지 않습니다. . on () 메소드는 이벤트 핸들러를 아직 DOM 내에 존재하지 않는 요소에 바인딩 할 수 있습니다. 이벤트를 특정 선택기에 직접 첨부하는 대신 부모 요소를 지정하고 이벤트 대표단을 사용하여 동적으로 추가 된 후손의 이벤트를 캡처합니다. // 무언가를합니다 });

이 예제에서

요소는이 경우 부모 요소로 사용되지만

$('body').on('click', '#anchor1', function() {
    $(this).append('

예

코드 :

및 다음 JavaScript 코드 : $ ( 'body'). on ( 'click', '#anchor1', function () { $ (this) .append ( '

사용자가 #mant

결론

방법 및 이벤트 대표단을 사용하여 이벤트 핸들러가 정적 및 동적으로 생성 된 요소 모두에 첨부되어 복잡한 웹 애플리케이션에 이벤트 처리를 보장 할 수 있습니다.