> 백엔드 개발 > PHP 튜토리얼 > DOM에 요소를 동적으로 추가한 후 JavaScript 이벤트가 트리거되지 않는 이유는 무엇입니까?

DOM에 요소를 동적으로 추가한 후 JavaScript 이벤트가 트리거되지 않는 이유는 무엇입니까?

Patricia Arquette
풀어 주다: 2024-11-16 10:19:02
원래의
304명이 탐색했습니다.

Why do JavaScript events fail to trigger after dynamically adding elements to the DOM?

요소 추가 후 JavaScript 이벤트 전파 실패

질문:

JavaScript가 실패하는 이유 초기 이후 DOM에 추가된 요소에 대한 이벤트를 트리거합니다. 로드 중이신가요?

답변:

jQuery는 로드 시 DOM에 있는 요소에서 작동합니다. 후속 요소 추가는 인식되지 않습니다. 이러한 제한을 극복하려면 새로 추가된 요소의 이벤트를 기존 DOM 요소에 전달하여 이벤트 위임을 구현하세요.

제공된 코드에서 "편집" 링크에 대한 이벤트 핸들러를 페이지에 존재하는 상위 요소로 이동하세요. on() 메서드를 사용하여 로드합니다.

$(document).on('click', '.races', function(e) {
  // Event handling logic
});
로그인 후 복사

이 수정을 통해 JavaScript는 DOM에 동적으로 추가된 요소의 이벤트에 계속해서 응답합니다.

위 내용은 DOM에 요소를 동적으로 추가한 후 JavaScript 이벤트가 트리거되지 않는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿