8

我有一个输入字段,我通过 css 类定义为日期选择器。我现在想克隆这个输入字段并拥有它,所以克隆的输入也是日期选择器。

从各种来源阅读后,我被引导相信以下代码应该可以工作,但事实并非如此。我希望也许有人可以帮助我弄清楚我做错了什么:)

<input type="text" id="date" name="date" class="calendar" />
<input type="button" id="clone" name="clone" value="Clone dates" />

这是javascript:

<script type="text/javascript">
$(document).ready(function(){

 $('.calendar').datepicker();

 $('#clone').click(function()
 {
  $('.calendar:last').clone().append().insertAfter('.calendar:last');
 });

});

</script>

到目前为止,输入字段被复制并插入在最后一个实例之后,但日期选择器不起作用。我尝试将 'true' 传递给克隆函数,但它给了我一个错误,说inst 没有定义

任何帮助,将不胜感激 :)

4

4 回答 4

14

将其更改为:

$('.calendar:last').clone(false).removeClass('hasDatepicker').insertAfter('.calendar:last').datepicker();
于 2010-03-01T20:40:17.370 回答
5

糟糕的是,我无法再对上面给出的答案发表评论,但代码仍然失败!日期选择器显示在克隆的输入元素处,但在原始输入字段中使用选定的日期值并将克隆的输入字段留空..有什么建议吗?

编辑:

使用以下代码为我修复了它..

$('.datum',clone).removeClass("hasDatepicker").attr('id',"").datepicker();

(请注意,我已经克隆了一个包装器,并且只针对该包装器中的“基准”输入字段)

按照上面的建议删除类后,我还删除了克隆输入元素的 id。它与原始输入相同,这就是为什么我在日期选择器框中使用所选日期更新原始输入字段的原因。

于 2011-01-25T20:57:09.643 回答
0

这可能有点晚了,但上面的所有建议都对我不起作用,我想出了一个简单的解决方案。

首先,是什么导致了问题:JQuery 将 datepicker 分配给元素 id。如果你正在克隆元素,那么同样的 id 也可能被克隆。哪个 jQuery 不喜欢。无论您单击哪个输入字段,您最终都可能会收到空引用错误或分配给第一个输入字段的日期。

解决方案:

1) 销毁 datepicker 2) 为所有输入字段分配新的唯一 ID 3) 为每个输入分配 datepicker

确保您的输入是这样的

<input type="text" name="ndate[]" id="date1" class="n1datepicker">

在克隆之前,销毁日期选择器

$('.n1datepicker').datepicker('destroy');

克隆后,也添加这些行

var i = 0;
$('.n1datepicker').each(function () {
    $(this).attr("id",'date' + i).datepicker();
    i++;
});

神奇的事情发生了

于 2013-06-17T17:35:18.120 回答
0

我做了以下更改并且它有效。

前:

 $('#clone').click(function()
 {
  $('.calendar:last').clone().append().insertAfter('.calendar:last');
 });

后:

 $('#clone').click(function()
 {
  $('.calendar:last').clone().append().insertAfter('.calendar:last').attr('id',"");
 });
于 2013-01-16T02:34:08.547 回答