Datepicker - 不会附加到动态元素
Datepicker - Won't attach to Dynamic element
我知道这个问题之前已经在 SO 上被问过和回答过,但是这些解决方案没有成功地使它起作用,或者我错过了一个可行的方法
index.php
<id="fupdiv"></div>
<input name="non-dynamic-test-element" type="text" class="datepicker">
<button id="addticket">Open Dynamic Form</button>
Jquery:
$(document).ready(function(){
$( ".datepicker" ).datepicker();
$(document).on('click','#addticket', function() {
$("#fupdiv").load('blocks/form-followup.php');
$("#fupdiv").fadeIn();
$( ".datepicker" ).datepicker("refresh");
});
});
形式-followup.php
<div>
<label> Should get datepicker on click</label> <input type="text" class="datepicker" id="dynamic-input">
</div>
问题:
单击 "non-dynamic-test-element" 输入可以正确打开 DatePicker。单击已加载的 "dynamic-element" 输入不会,控制台中不会抛出任何错误,我尝试了几种不同的方法将日期选择器附加到动态元素。据我了解,在加载后使用 .on() 方法和绑定日期选择器应该有效吗?任何帮助将不胜感激。
AJAX 调用是异步的,因此刷新可以在元素放置在 DOM 之前执行,因此没有绑定。所以应该在加载回调中刷新绑定。
$("#fupdiv").load('blocks/form-followup.php',function(){
$( ".datepicker" ).datepicker();
});
我知道这个问题之前已经在 SO 上被问过和回答过,但是这些解决方案没有成功地使它起作用,或者我错过了一个可行的方法
index.php
<id="fupdiv"></div>
<input name="non-dynamic-test-element" type="text" class="datepicker">
<button id="addticket">Open Dynamic Form</button>
Jquery:
$(document).ready(function(){
$( ".datepicker" ).datepicker();
$(document).on('click','#addticket', function() {
$("#fupdiv").load('blocks/form-followup.php');
$("#fupdiv").fadeIn();
$( ".datepicker" ).datepicker("refresh");
});
});
形式-followup.php
<div>
<label> Should get datepicker on click</label> <input type="text" class="datepicker" id="dynamic-input">
</div>
问题: 单击 "non-dynamic-test-element" 输入可以正确打开 DatePicker。单击已加载的 "dynamic-element" 输入不会,控制台中不会抛出任何错误,我尝试了几种不同的方法将日期选择器附加到动态元素。据我了解,在加载后使用 .on() 方法和绑定日期选择器应该有效吗?任何帮助将不胜感激。
AJAX 调用是异步的,因此刷新可以在元素放置在 DOM 之前执行,因此没有绑定。所以应该在加载回调中刷新绑定。
$("#fupdiv").load('blocks/form-followup.php',function(){
$( ".datepicker" ).datepicker();
});