我有一个表格,其中每个单元格都是表格的一部分。在我的表单中,我在输入元素上应用了一个 jquery datepicker:
<form method="post" action="test.php">
<table>
<tr>
....
<td>
<input type="text" id="date" name="test"/>
</td>
....
</tr>
</table>
<button type="button" id="addLine">Add line</button>
<button id="submit" type="submit">Submit</button>
</form>
我像这样添加我的日期选择器:
$(document).ready(function() {
$('#date').datepicker({showAnim: "slideDown"});
});
问题来了......我想在我的表中添加一行,但日期选择器不适用于新添加的行......
$(document).ready(function() {
$('#addLine').click(function() {
var line = $('<tr>...<input type="text" id="date" name="test"/>...</tr>');
$('table').append(line);
});
});
新行出现但是当我想插入一个值时,日期选择器不会在新创建的行上弹出。
我试图在我的 .click(function... 中放置另一个 $('#date').datepiker()... 但它不起作用。我也尝试用一种方法刷新 dom调用 page().. 但我有一个错误,该方法在元素上不存在。我需要你的帮助!
谢谢
最佳答案
您不能有多个具有相同值的 id,这可能会导致您的一些问题。改用类名,例如 class="date"
<input type="text" class="date" name="test"/>
由于您正在动态添加内容,因此加载后您可以触发
datePicker
功能。所以:
line.find(".date").datepicker({showAnim: "slideDown"})
sample :http://jsbin.com/omoyiy/2/edit
关于jquery-ui - jquery datepicker 不显示在动态添加的输入上,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14596724/