Question

我发现了datepicker的问题。我正在添加dinamically控件，其中一个是一个日期选择器，旁边有几个选项和一个textarea。

好吧，每当我添加一个datepicker，让我说我有3 datepickers，我设置第一个的日期，然后我尝试设置第二个或第三个的日期，好吧，我的问题是设置第二个或第三个的日期将其设置为第一个

请参阅此fiddle以查看已转载的问题。只需添加2或3个日期选择器，单击添加按钮并尝试设置日期。任何有关为什么以及如何解决的想法都将非常感激

Answer 1

这是因为您在克隆元素时使用相同的ID，如果您使用相同的ID，则JavaScript无法区分它们。

如果您将ID切换为类，则可以使用，请参阅此处：http://jsfiddle.net/j72UG/2/

HTML

<input type='button' value="add" id="addLi" />
<ul class="list">
    <li class="dateLi">
        <input type='text' class='date' />
    </li>
</ul>

JS

var liClone;

$(function () {
    liClone = $(".dateLi").clone(true);
    $(".dateLi").remove();
    $("#addLi").click(function () {
        var clonado = liClone.clone(true);
        clonado.appendTo(".list");
        clonado.find("input").datepicker();
    });
});

Answer 2

当您进行克隆时，所有元素都保留相同的ID。在给定的DOM结构中，在任何给定时间只有一（1）个元素可以具有特定的ID。因此，请为列表项目提供一个类或以序列结尾的ID，以避免将来出现此问题。

var li = $('<li class="dateLi"><input type="text" /></li>');

请参阅此更新jsfiddle。

Answer 3

那是因为你必须改变每个输入和li的id 试试这个：

jsfiddle.net/LgRR7/

动态添加的datepicker将无法正常工作

3 个答案: