如何在不打开日历的情况下动态更改日期答案

【问题标题】：How to change date dynamically without opening calendar如何在不打开日历的情况下动态更改日期
【发布时间】：2017-10-15 02:49:01
【问题描述】：

我正在使用bootstrap-datepicker 并创建了一个将日期选择器日期重置为今天的函数，一切正常，除了当我调用我的函数时，它会自动打开日历框，该日历框保持在页面上并且即使在失去焦点。我怎样才能避免这个问题，或者在日期重置时不自动打开日历（我从堆栈中尝试了一些解决方案，但没有任何效果..）

日期选择器配置

$('#sandbox-container .input-group.date').datepicker({
  language: "he",
  rtl: true,
  autoclose: true, 
  todayHighlight: true,
  format: "dd/mm/yyyy"
});

重置日期的功能

function resetStartDatePicker() {
  //option 1 - didn't work
  $("#sandbox-container").focusout(function () {
    $("#sandbox-container").hide;
  });

  //option 2 - didn't work
  $("#sandbox-container ~ .ui-datepicker").hide();

  //option 3 - didn't work
  $("#sandbox-container").datepicker().on('changeDate', function () {
    $(this).blur();
  });

  //option 4 - didn't work
  $.fn.datepicker.defaults.autoclose = true;
  var today = getToday();                      
  $("#sandbox-container").find("input").val(today.a);     
  $("#sandbox-container").datepicker("update", today.b);                    
}

HTML

<div id="sandbox-container" >   
  <div id="positionSorter" style="margin-top:10%">
    <a id="anotherDatelink" title="reset" class="pull-left" href="#" onclick="resetStartDatePicker()">reset</a>
  </div>

  <div class="input-group date" data-provide="datepicker" style="float:right">
    <input type="text" class="form-control  @semanticClass"  name="@Model.Name" id="@Model.Id" title="@Model.Name" value="@val">
    <div class="input-group-addon">
      <span class="glyphicon glyphicon-calendar"></span>
    </div>
  </div>
</div>

【问题讨论】：

如果可以，请务必提供任何代码示例或小提琴。以便用户了解问题所在。还有你也在使用哪个日期选择器。
@BibyAugustine 我正在使用引导日期选择器
这应该隐藏它：$("#sandbox-container input").datepicker('hide');
您是否使用文本框作为日期选择器？
bootstrap datepicker today as default的可能重复

标签： javascript jquery datepicker bootstrap-datepicker

【解决方案1】：

您将日期选择器附加到 div 元素，实际上这就是问题所在。

给文本框输入id

<input id="txtDate" type="text" class="form-control  @semanticClass"  name="@Model.Name" id="@Model.Id" title="@Model.Name" value="@val">

并在javascript中定义

$('#txtDate').datepicker({
                language: "he",
                rtl: true,
                autoclose: true, 
                todayHighlight: true,
                format: "dd/mm/yyyy"
            });

或者如果您想使用您提供的like，只需更改like

$('#sandbox-container input').datepicker({
                language: "he",
                rtl: true,
                autoclose: true, 
                todayHighlight: true,
                format: "dd/mm/yyyy"
            });

以上代码从沙盒容器 div 中查找输入元素。

【讨论】：

试过了，它从第一秒开始显示日历......并且没有隐藏它：/

【解决方案2】：

这是一个JSFiddle，它显示了如何设置一个值然后隐藏它-

 $('#anotherDatelink').on('click', function(e) {
   $("#sandbox-container").find("input").val('01/01/2010');
   $("#sandbox-container .input-group").datepicker('hide');
 });

【讨论】：

【解决方案3】：

在检查日期选择器之后，解决我的问题的是：

 $(".datepicker-days").hide();

感谢你的帮助，我喜欢你所有的答案

【讨论】：