Bootstrap日期选择器setDatesDisabled无法处理按钮单击

Bootstrap datepicker setDatesDisabled not working on button click

本文关键字:处理 按钮 单击 日期 选择器 setDatesDisabled Bootstrap      更新时间:2023-10-27

尝试设置日期在单击按钮时禁用引导程序日期选择器,但它不起作用。

HTML:

<div id="container">
  <div id="date-range">
    <div class="range-start"></div>
    <div class="range-end"></div>
  </div>
  <button id="button" class="btn btn-warning">Disable Dates</button>
</div>

JavaScript:

$(function() {
  $('#date-range').datepicker({
    inputs: $('.range-start, .range-end'),
    format: 'yyyy-mm-dd',
    datesDisabled: ['2016-04-21', '2016-04-20', '2016-04-13']
  });
  $('#button').click(function() {
    $('#date-range').datepicker('setDatesDisabled', ['2016-04-29', '2016-04-30']);
  });
});

Fiddle:https://jsfiddle.net/kaygee79/953zk742/

在初始化日期选择器时使用指定的inputs

$(function() {
  $('#date-range').datepicker({
    inputs: $('.range-start, .range-end'),
    format: 'yyyy-mm-dd',
    datesDisabled: ['2016-04-21', '2016-04-20', '2016-04-13']
  });
  $('#button').click(function() {
    $('.range-start').datepicker('setDatesDisabled', ['2016-04-29', '2016-04-30']);
    $('.range-end').datepicker('setDatesDisabled', ['2016-04-29', '2016-04-30']);
  });
});

工作小提琴:https://jsfiddle.net/f50ga49j/