javascript - jquery-ui datepicker 没有出现在动态输入中

Question

我继承了一堆质量参差不齐的代码，并且正在修复一堆错误的地方。它做的一件事是有一个表单输入表，其中一个使用 jquery-ui Datepicker。还有一个按钮可以在表格底部创建一个新行。新行的日期选择器永远不会出现。

我已经在 SO 上多次看到此问题，但这些解决方案均无效。我正在把我现在所拥有的。我的 jfiddle 在:

http://jsfiddle.net/squarepegsys/G8WEC/2/

我的代码的核心在这里:

tr.find(".datepicker").on("focusin",function() {
    console.log("got focus");
    $(this).datepicker();

}); 

在 on("focusin"...) 行中，我在控制台上看到“获得焦点”，但从未看到日期选择器出现。

Answer 1

当您创建日期选择器实例时，jQuery 会为其分配一个 ID，当您克隆它时，您就是在复制它。相反，通过以下方式动态创建日期选择器实例:

$(document).on('focus', ".datepicker", function () {
    $(this).datepicker( "destroy" ).datepicker();
})

jsFiddle example

这将适用于动态创建的元素，jQuery 将正确管理 ID。