复制jQuery datepicker
datepicker函数仅适用于创建的第一个输入框。
我试图通过克隆包含它的div来复制一个datepicker。
click input-text date time picker
要初始化datepicker，根据jQuery UI文档我只需要做$('#example').datepicker(); 它确实有效，但仅限于创建的第一个datepicker。
复制div的代码如下：
$("a#dupMe").click(function(event){ event.preventDefault(); i++; var a = $("#template") .clone(true) .insertBefore("#template") .hide() .fadeIn(1000); a.find("input#txt").attr('value', i); a.find("input#example").datepicker(); });
最奇怪的是在document.ready我已经：
$('#template #example').datepicker(); $("#template #txt").click(function() { alert($(this).val()); });
如果我点击#txt它总是有效。
我建议你也只使用一个通用的类名。 但是，如果您出于某种原因反对这种情况，您还可以编写一个函数来为模板div所有文本框创建日期选择器（在每次复制后调用）。 就像是：
function makeDatePickers() { $("#template input[type=text]").datepicker(); }
我使用CSS类代替：
然后，在你的document.ready函数中：
$('.calendar').datepicker();
以这种方式为多个日历字段使用它对我有用。
我有一个非常类似的问题，经过几个小时的测试，我找到了解决方案。 我正在复制一段HTML代码并将其插入已包含jQuery日期选择器日历的部分之后。 我最初没有意识到的是jQuery UI日历在执行.datepicker()函数时修改了元素的类。 结果是当您尝试复制代码并为该新部分启动日历的新实例时，它失败了，因为根据CSS已经存在。 如果您尝试使用.datepicker('destroy')则无法销毁此ghost实例，因为它实际上并不存在。 我通过在HTML中重置日期选择器元素的类然后将datepicker添加到该元素来解决了这个问题…
以下是我使用的代码。 希望这能节省别人的时间……
$('#addaddress').click(function() { var count = $('.address_template').size(); var html = $('.address_template').eq(0).html(); $('#addaddress').before('' + html + ''); $('.address_template H1').eq(count).html("Previous Address " + count); $('.address_date').eq(count).attr("class","address_date"); $('.address_date').eq(count).attr("id","movein" + count); $("#movein" + count).datepicker(); });
我克隆的html有多个datepicker输入。
使用Ryan Stemkoski的答案和Alex King的评论，我提出了这个解决方案：
var clonedObject = this.el.find('.jLo:last-child') clonedObject.find('input.ui-datepicker').each(function(index, element) { $(element).removeClass('hasDatepicker'); $(element).datepicker(); }); clonedObject.appendTo('.jLo');
谢谢你。