Question

git log

Answer 1

尝试在“.on”调用之后添加以下任意一项或两者：

e.preventDefault();
e.stopPropagation();

Answer 2

因为没有改变的原因是因为你每次进行一次更改都会过度分配日期选择器，所以你应该按照你应该这样做的方式进行操作。

我们首先初始化两个选择器，然后每次开始更改转到一个为我们更新结束选择器值的函数。

旁注：我使用了moment.js，因为通过这种方式添加天数会更容易。 至少对我来说更容易

＆＃13;

$("#start_date").datepicker({
  format: 'yyyy-mm-dd',
  autoclose: true,
  endDate: '+0days'

}).on('changeDate', function(e) {
  let start_date = $('#start_date').datepicker('getDate', '+0d');
  let end_date = moment(start_date).add('31', 'days');
  setMinMax(start_date, end_date);
});

$("#end_date").datepicker({
  format: 'yyyy-mm-dd',
  autoclose: true,
});

function setMinMax(startDate, endDate) {
  let $endPicker = $("#end_date");

  //This a moment function
  $endPicker.val(endDate.format('YYYY-MM-DD')); 
  $endPicker.datepicker('setStartDate', startDate);
  //We parse the moment object to JS date,
  //so that way we    don't have problems
  $endPicker.datepicker('setEndDate', endDate.toDate()); 
}

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.1/moment.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.8.0/js/bootstrap-datepicker.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.8.0/css/bootstrap-datepicker.min.css" rel="stylesheet" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />

<br/>
<div class="span5 col-md-5" id="sandbox-container">
  <input id="start_date" class="form-control" type="text">
  <br/>
  <input id="end_date" class="form-control" type="text">
</div>

＆＃13;

datepicker end_date仅在第一次更改＆＃34; on＆＃34;点击事件，然后当下一个事件点击＆＃34; on＆＃34; end_date上的datepicker没有改变？

2 个答案: