日期选择器不适用于动态添加的 html 元素

Question

日期选择器无法处理我动态添加的 html table 输入字段。我使用 clone 函数来制作动态字段。

如果父项具有值，则日期选择器不工作，但如果父项为空，则它可以工作。或者有时有时不工作。表现得很奇怪:(

我做错了什么，谁能帮我解决这个问题？提前致谢

我正在使用 jquery-ui 日期选择器

这是我的Fiddle

$('body').on('focus',".datepicker", function(){
    $(this).datepicker({
        dateFormat: "dd/mm/yy",
        changeMonth: true,
        changeYear: true,
        yearRange: '1930:-14',
    });
});

Answer 1

你的代码的问题是当你从上面的行克隆输入时，它也会有克隆 hasDatepicker class 这会破坏它。

要测试它，只需不要聚焦输入并添加额外的行并聚焦第二行的输入即可。

这是解决方案。

                $('body').on('focus',".datepicker", function(){
                $(this).datepicker({ //Change this line here

至

                $('body').on('focus',".datepicker", function(){
                $(this).removeClass('hasDatepicker').datepicker({ //Change this line here

它会先重置输入然后初始化datePicker

日期选择器不适用于动态添加的 html 元素

Date picker is not working on dynamically added html element

jquery

jquery-ui