到期日根据用户输入和日期选择器中的开始日期计算

Question

你好，根据用户输入和开始日期计算结束日期

<div class="form-group">
    <label>Months</label>
    <input type="text" name="chit_months" class="form-control">
</div>
<div class="form-group">
    <label>Start Date</label>
    <div class='input-group date' id='datetimepicker1'>
        <input type='text' class="form-control" name="start_date" id="example1" />
        <span class="input-group-addon">
            <span class="glyphicon glyphicon-calendar"></span>
        </span>
    </div>
</div>

<script>
    $('#example1').datepicker({
        format: "dd/mm/yyyy"
    });

    $('#example2').datepicker({
        format: "dd/mm/yyyy"
    });
</script>

我正在使用日期选择器，如果用户在文本框中输入月份并选择开始日期，结束日期应该由 jQuery 自动计算

请帮助我知道如何做到这一点。

Answer 1

下面的代码为您提供两个日期之间的差异，您可以计算您的到期金额

function getDueDays(){
   var sdate = new Date($('#startDate').val());
   var month = new Date($('#month').val());
   Date dd= new Date(new Date(sdate).setMonth(sdate.getMonth()+month));
   $('#endDate').val(dd);  
}

Answer 2

你可以的

jQuery(function($) {
  $('#example1').datepicker({
    dateFormat: "dd/mm/yy"
  });

  $('#example2').datepicker({
    dateFormat: "dd/mm/yy"
  });

  $('#chit_months, #example1').change(function() {
    var months = +$('#chit_months').val() || 0,
      date = $('#example1').datepicker('getDate');
    if (months && date) {
      date.setMonth(date.getMonth() + months);
      $('#example2').datepicker('setDate', date);
    } else {
      $('#example2').val('');
    }
  })
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/css/bootstrap.css" rel="stylesheet" />
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/redmond/jquery-ui.css" rel="stylesheet" />


<div class="form-group">
  <label>Months</label>
  <input type="text" id="chit_months" name="chit_months" class="form-control" />
</div>
<div class="form-group">
  <label>Start Date</label>
  <div class='input-group date' id='datetimepicker1'>
    <input type='text' class="form-control" name="start_date" id="example1" />
    <span class="input-group-addon">
      <span class="glyphicon glyphicon-calendar"></span>
    </span>
  </div>
</div>
<div class="form-group">
  <label>End Date</label>
  <div class='input-group date' id='datetimepicker2'>
    <input type='text' class="form-control" name="start_date" id="example2" />
    <span class="input-group-addon">
      <span class="glyphicon glyphicon-calendar"></span>
    </span>
  </div>
</div>