我有一个表,每行都有一个数据选择器,并为每个日期选择器动态生成ID。我目前有一个脚本,该脚本会在更改日期时触发,但是我发现当用户使用键盘来编辑此输入字段时也会触发该脚本。
我可以更改为使用changeDate事件,但是当我无法为每个日期选择器指定ID时,不确定是否可以与多个日期选择器一起使用?另一个选择是阻止用户直接使用键盘修改数据,但不确定是否可以?
这是我的表格当前外观的一个示例:
$(document).ready(function() {
$(".form-control.datepicker").change(function() {
alert("starting Date Updated Changes");
//console.log( 'starting Date Updated update' );
});
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.8.0/js/bootstrap-datepicker.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.8.0/locales/bootstrap-datepicker.en-AU.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.8.0/css/bootstrap-datepicker.css" rel="stylesheet" />
<script>
$('.datepicker').datepicker({
todayHighlight: true,
clearBtn: true,
autoclose: true
})
</script>
<table class="table table-condensed table-striped table-bordered">
<tbody>
<tr id="70283">
<td>FT523452</td>
<td>X234</td>
<td>Container Oranges</td>
<td>534830</td>
<td class="">ZDSFASDF42234</td>
<td>Transit</td>
<td id="70283"><input type="text" id="70283" class="form-control datepicker" autocomplete="off" placeholder="Date Updated" data-date-format="dd/mm/yyyy" name="dateUpdated"></td>
</tr>
<tr id="70543">
<td>PB213412</td>
<td>Z98787</td>
<td>Container Apples</td>
<td>535092</td>
<td class="">PSDFKS42134</td>
<td>Transit</td>
<td id="70543"><input type="text" id="70543" class="form-control datepicker" autocomplete="off" placeholder="Date Updated" data-date-format="dd/mm/yyyy" name="dateUpdated"></td>
</tr>
</tbody>
</table>