>웹 프론트엔드 >JS 튜토리얼 >동적으로 추가된 elements_jquery에 이벤트를 바인딩하는 jQuery의 방법

동적으로 추가된 elements_jquery에 이벤트를 바인딩하는 jQuery의 방법

WBOY
WBOY원래의
2016-05-16 16:10:401086검색

이 기사의 예에서는 jQuery가 이벤트를 동적으로 추가된 요소에 바인딩하는 방법을 설명합니다. 참고할 수 있도록 모든 사람과 공유하세요. 구체적인 분석은 다음과 같습니다.

jquery의 바인딩 이벤트는 일반적으로 바인딩이나 클릭을 사용하지만 이는 로드된 요소에 대해서만 이벤트를 정의할 수 있으며 나중에 추가 및 삽입되는 요소는 별도로 바인딩해야 합니다. 버전 1.7 이전에 라이브를 사용하세요. 단, 1.8 버전 이후 사용을 권장합니다. 다음은 jQuery에서 동적으로 추가된 요소에 이벤트를 바인딩하는 방법에 대한 소개입니다
실제 개발에서는 트리거 이벤트를 동적으로 생성된 HTML 요소에 바인딩해야 하는 상황에 직면하게 됩니다.

예를 들어

<div id="testdiv">
  <ul></ul>
</div>

ff6d136ddc5fdfeffaf53ff6ee95f185 내에 동적으로 추가된 25edfb22a4f469ecb59f1190150159c6 태그에 클릭 이벤트를 추가해야 합니다.
jquery 버전 1.7 이전에는 라이브 동적 바인딩 이벤트가 사용되었습니다

$("#testdiv ul li").live("click",function(){
});
jquery 버전 1.7 이후에는 on을 사용하여 이벤트를 동적으로 바인딩합니다

$("#testdiv ul").on("click","li", function() {
     //do something here
 });
이 기사가 모든 사람의 jQuery 프로그래밍에 도움이 되기를 바랍니다.

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.