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

标签 jquery twitter-bootstrap datepicker

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

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

详细说明:用户只能选择距离当前日期 7 天的日期。还有一个按钮,使用户能够从选择器中清除所选日期,然后选择一个新日期。现在,清除功能只能从选择器中清除输入元素(但不能清除选择器元素中的实际日期),或者通过选择器配置清除选择(例如开始日期:“+7d”。我想仅清除所选日期,而不重置所有内容。

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');
});

});

最佳答案

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

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

更新了 fiddle :http://jsfiddle.net/4L6fhjLf/2/

关于jquery - Bootstrap 3 DatePicker - 如何在不重置选择器配置的情况下重置所选日期?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31003648/

相关文章:

php - Jquery Datepicker - 从 mysql 数据库启用日期

jquery - 使用 AJAX、jquery 和 codeigniter 显示数据库中的数据

jQuery 在页面加载时播放 iframe 嵌入式 YouTube 视频

jquery - Bootstrap 菜单 - 两个相互切换的折叠按钮?意思是,一次只能打开 1 个

html - 我的 Bootstrap 导航栏不工作

jquery - 使用 jQuery "loader screen,"时,Bootstrap HTML 的其余部分未隐藏

javascript - 主干模型和日期选择器默认日期

javascript - jQuery 手机 : supply parameters in hash URL?

javascript - 提交表单时(验证之前)立即显示模式

android - DatePicker.setMinDate(long minDate) 抛出 IllegalArgumentException : Time not between