Question

我一直在尝试显示另一个日期字段的日期，并选择当前字段的日期。它仅适用于第一行。以下是代码：

使用Javascript：

<script type='text/javascript'>
//<![CDATA[
$(function(){

$('.one').datepicker({
onSelect: function(date){
  var date2 = $('.one').datepicker('getDate');
  date2.setDate(date2.getDate()+1);
  $('.two').datepicker('setDate', date2);
}
})
$('.two').datepicker({})

});
$(document).ready(function() {
var currentItem = 1;
$(".datepicker").datepicker();
$('#addnew').click(function(){
currentItem++;
$('#items').val(currentItem);
var strToAdd = '<tr><td style=""><input type="text" name="task'+currentItem+'" id="task'+currentItem+'" value="" /></td><td style=""><input type="text" name="Description'+currentItem+'" id="Description'+currentItem+'" value="" /></td><td style="width: 160px;"><input type="text" class="one datepicker" name="Internal_Deadline'+currentItem+'" id="Internal_Deadline'+currentItem+'" /></td><td style=""><input type="text" class="two datepicker" name="Client_Deadline'+currentItem+'" id="Client_Deadline'+currentItem+'" /></td><td style=""><input type="text" class="datepicker" name="Actual_Deadline'+currentItem+'" id="Actual_Deadline'+currentItem+'" /></td><td style="width:83px;"></td></tr>';
 $('#data').append(strToAdd);
   $(".datepicker").datepicker(); 

  });
  });

  //]]>

  </script>

HTML：

<TABLE id="data" class="dd" style="">
    <TR>
    <td style=""><input type="text" name="task1" id="task1" value="" /></td><td style=""><input type="text" name="Description1" id="Description1" value="" /></td><td style="width: 160px;"><input type="text" class="one datepicker" name="Internal_Deadline1" id="Internal_Deadline1" value="" /></td><td><input type="text" class="two datepicker" name="Client_Deadline1" id="Client_Deadline1" value="" /></td><td style=""><input type="text" class="datepicker" name="Actual_Deadline1" id="Actual_Deadline1" value="" />             </td><td style="width: 83px;"></td></tr>
    <input type="hidden" id="items" name="items" value="1" /> 
    </TABLE>

Answer 1

您需要进行后期绑定才能使事件处理稍后将添加的DOM元素：

    $(function () {

        $('.one').datepicker();

        $('#data').on('change', '.one', function (date) {                
            var date2 = $(this).datepicker('getDate');
            date2.setDate(date2.getDate() + 1);                
            $(this).parent('td').next('td').find('.two').datepicker('setDate', date2);                                
        });

        $('.two').datepicker();

    });

自动日期选择onselect使用“添加行”功能选择另一个日期文本框

1 个答案: