Question

我尝试在按钮点击时重置所选日期，但到目前为止，我只能清除input元素，而没有选择器上的实际日期。以下代码重置了所有内容，包括配置和日期，因此它显然不是我需要的。

$('#datepicker').datepicker('update',''); //resets everything

详细说明：用户只能选择当天7天后的日期。还有一个按钮，用户可以从选择器中清除所选日期，并选择一个新日期。现在，清除功能只能清除拾取器中的输入元素（但不能清除拾取器元素中的实际日期），或清除选择器配置中的选择（例如startDate：＆＃34; + 7d＆＃34我希望只清除所选日期，而不重置所有内容。

jsfiddle

这是我到目前为止所提出的：
HTML：

<div id="myDatepicker" class="input-group date">
   <input type="text" class="form-control" id="datepick">
   <span class="input-group-addon">
   <i class="fa fa-calendar"></i>
   </span>
   <a href="#" id="duration_tag"></a>
</div>
<button type="button" id="clear">clear</button>

jQuery的：

$(document).ready(function() {

$("#clear").click(function(){
    $('#datepick').val(" ").datepicker({startDate: "+7d"});                  
});

$('#myDatepicker').datepicker({
                    startDate: "+7d",
                });

$('#myDatepicker').on('changeDate', function(e){
     $(this).datepicker('hide');
});

});

Answer 1

您需要获取当前的datePicker实例并在其上调用setDate(null)。你可以这样做：

$("#clear").click(function(){
  $('#myDatepicker').data('datepicker').setDate(null);
});

更新小提琴：http://jsfiddle.net/4L6fhjLf/2/

Answer 2

$('#myDatepicker').data('DateTimePicker').date(null);

Answer 3

由于某些原因，以上示例均不适用于我，但以下示例确实有效：

$('#myDatepicker').data('DateTimePicker').clear(); // clears input value

实际上与Dirk Vermeer's答案相同，该答案对我要找的东西无效。

我还需要更改viewMode才能开始选择程序，在我的情况下，这可能是几十年了，您可能需要一个不同的viewMode选项：

$('#myDatepicker').data('DateTimePicker').clear().viewMode('decades')

Bootstrap 3 DatePicker - 如何在不重置选择器配置的情况下重置所选日期？

3 个答案: