gpt4 book ai didi

javascript - 如何将日期选择器附加到具有相同 ID 的表格的每一行?

转载 作者:行者123 更新时间:2023-11-30 12:23:41 24 4
gpt4 key购买 nike

我有一个 JavaScript 函数将日期选择器附加到表的每一行数据,并且行是动态创建的,并使用这个日期选择器函数附加到字段。但问题是如果我在表中创建了额外的行正在附加日期选择器,但在该附加行中,日期选择器不工作,它看起来像禁用状态。

<script>
$(document).ready(function() {
$("input.add").live('click', function() {
var $tr = $(this).closest('tr');
var $clone = $tr.clone();
$clone.find(':text').val('');
$clone.find(':checkbox:checked').prop('checked', false).val('N');
$tr.after($clone);
});
$("input.delete").live('click', function() {
var rowCount = document.getElementById('phone').getElementsByTagName("tr").length;
if (rowCount != 3) {
var $tr = $(this).closest('tr');
$tr.remove();
return false;
}
});
});

$(function() {
$("#dob").datepicker({
//showOn: both - datepicker will appear clicking the input box as well as the calendar icon
//showOn: button - datepicker will appear only on clicking the calendar icon
showOn: 'button',
//you can use your local path also eg. buttonImage: 'images/x_office_calendar.png'
buttonImage: 'file:///C:/Users/27983/Desktop/calender.jpg',
buttonImageOnly: true,
changeMonth: true,
changeYear: true,
duration: 'fast',
dateFormat: 'dd-mm-yy'
});
});
</script>
 <style>
#ui-datepicker-div {
font-size: 12px;
}

#datepicker {}
</style>
  <body>
<form name="Basicinfo" id="Basicinfo" method="post" action="Basic.html">
<!-- Start Header -->
<table id="phone" width="100%" name="phone">
<tr>
<td colspan="5" bgcolor="#5C85B3">Phone</td>
</tr>
<tr>
<th>Type</td>
<th>Date</th>
<th>*Phone</th>
<th>Preferred</th>
<th>Add/Delete</th>
</tr>
<tr>
<td>
<select name="phntype" id="phntype" style="width:50%"></select>
</td>
<td>
<input id="dob" name="dob" type="text" value="">
</td>
<td>
<input type="text" name="phone_no" id="phone_no" value="">
</td>
<td>
<input type="hidden" name="prefferd" value="NO">
<input type="checkbox" name="preferred" id="preferred" value="N" onchange="changeCheckBox();">
</td>
<td>
<input type="button" value="+" class="add">
<input type="button" value="-" class="delete">
</td>
</tr>
</table>
</form>
</body>

最佳答案

您知道,id 属性应该是唯一的。你最好设置一个类:

<input class="datePickerInput" name="dob" type="text" value="">

然后按类而不是按 id 选择它:

$(".datePickerInput").datepicker({

关于javascript - 如何将日期选择器附加到具有相同 ID 的表格的每一行?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30207312/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com