Question

我有添加按钮，它会添加一个开始日期文本框和结束日期文本框以及一个流行日历。但是弹出的日历不起作用。

更新

$(document).ready(function () {
$(".datepicker").each(function () {
    $(this).datepicker();
});
$("#add").click(function () {
    $(".container").append('<div class= "Cycleone"> <table> <tr> <td> <label ID="lblStartDate">Start Date </label> </td> <td> <input type="text" id="txtStartDate" class="datepicker"/><label id="lblEndDate" >End Date</label></td><td><input type="text" id="txtEndDate" class="datepicker"/></td></tr></table></div>');
    $(".datepicker").datepicker();
})
});

按钮

<div class="button">
<input type="button" id="add" name="btnAddAddress" value="Add"  />

请尽可能提供一个例子。谢谢

Answer 1

添加到pop后，您可以初始化datepicker：

$("#btnAdd").click(function() {
    var addelement = $('<div class= "Cycle"> <table> <tr> <td> <label ID="lblStartDate">Start Date </label> </td> <td> <input type="text" id="txtStartDate" class="datepicker"/><label id="lblEndDate" >End Date</label></td><td><input type="text" id="txtEndDate" class="datepicker"/></td></tr></table></div>');
    $(this).after(addelement);
    $(".datepicker").datepicker();//here
});

原因：因为您在Document ready上初始化了datepicker但是DOM中还没有弹出日期选择器。

--Working DEMO--

<强>更新

您遇到了问题，因为在添加输入框时，即使对于标签，您也总是提供相同的ID txtStartDate，txtEndDate。 ID 在HTML网页中应该是唯一的。只需从JS代码中删除id：

--Expected DEMO--

如何添加流行日历？

1 个答案: