jQuery에서 생성된 요소에 Datepickers를 동적으로 적용하는 방법은 무엇입니까?

생성된 요소에 Datepicker를 동적으로 적용

jQuery에서 동적으로 생성된 요소에 datepicker() 함수를 적용하려고 하면 문제가 발생할 수 있습니다. 강요. 모든 요소에 공통 클래스를 할당하더라도 첫 번째 요소에만 작동할 수 있습니다.

문제:

날짜 선택기 달력이 필요한 동적으로 생성된 텍스트 상자가 있습니다. 클릭하면 나타납니다. 다음 코드를 사용하면

$(".datepicker_recurring_start" ).datepicker();

첫 번째 텍스트 상자에만 달력이 표시됩니다.

해결책:

이 문제를 해결하려면 다음을 활용하세요. 다음 접근 방식:

$('body').on('focus', ".datepicker_recurring_start", function(){
    $(this).datepicker();
});​

설명:

이 코드는 jQuery에서 위임된 이벤트를 활용합니다. 포커스 이벤트에 대한 전체 본문(body 요소)에 리스너를 추가합니다. datepicker_recurring_start 클래스가 있는 요소에 포커스가 생기면 인라인 함수가 실행됩니다. 그런 다음 이 함수는 이벤트를 트리거한 요소에 대해서만 datepicker() 함수를 초기화합니다.

이 기술을 사용하면 사용자 상호 작용 시 활성화되는 datepicker 기능이 있는 요소를 동적으로 생성할 수 있습니다. 자세한 내용은 위임된 이벤트에 대한 jQuery 문서(http://api.jquery.com/on/)를 참조하세요.

위 내용은 jQuery에서 생성된 요소에 Datepickers를 동적으로 적용하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!