jQuery 또는 jQuery UI를 사용하여 동적으로 생성된 입력 필드에서 날짜 선택기를 활성화하는 방법은 무엇입니까?

동적으로 생성된 요소에 Datepickers 연결 - JQuery/JQueryUI

문제 설명:

An 다음 코드를 사용하여 텍스트 상자를 동적으로 생성하고 클릭 시 각각에 대해 날짜 선택기를 활성화하려고 시도하면 첫 번째 텍스트 상자만 날짜 선택기를 수신하게 됩니다.

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

해결책:

동적으로 생성된 모든 요소에서 날짜 선택기를 활성화하려면 코드에서 아래와 같이 jQuery의 on() 메서드를 사용하여 이벤트 위임을 사용해야 합니다.

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

설명:

on() 메서드는 동적으로 생성된 모든 텍스트 상자의 상위 요소인 body 요소에 이벤트 리스너를 추가합니다. datepicker_recurring_start 클래스에 포커스가 있는 경우(예: 사용자가 해당 클래스가 있는 입력 필드를 클릭하는 경우) datepicker() 메서드가 포커스가 있는 요소에 적용됩니다.

이 접근 방식은 이벤트 첨부를 허용하는 이벤트 위임을 사용합니다. DOM에서 동적으로 추가되거나 제거되는 요소에 대한 리스너입니다. 이 경우 body 요소는 이벤트 리스너 대상으로 사용되고 datepicker_recurring_start 클래스 선택기는 포커스가 있을 때 datepicker를 트리거해야 하는 특정 요소를 식별하는 데 사용됩니다.

위 내용은 jQuery 또는 jQuery UI를 사용하여 동적으로 생성된 입력 필드에서 날짜 선택기를 활성화하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!