引导dateselect器隐藏后select

如何selectdate后隐藏日历? 有一个特定的function,我可以使用? 我的代码如下:

$('#dp1').datepicker({ format: 'mm-dd-yyyy', startDate: '-15d', autoclose: true, endDate: '+0d' // there's no convenient "right now" notation yet }); 

任何帮助,将不胜感激。

15 Solutions collect form web for “引导dateselect器隐藏后select”

您可以使用事件changedate()跟踪changedate() datepicker('hide')方法更改date的时间来datepicker后隐藏datepicker

 $('yourpickerid').on('changeDate', function(ev){ $(this).datepicker('hide'); }); 

演示

UPDATE

这是autoclose: true的错误autoclose: true 。 这个bug在最新的高手里解决了。 看到承诺 。 从GitHub获取最新的代码

如果对任何人有任何帮助,引导dateselect器的2.0版不再适用于接受的答案。

以下是我如何在我的工作:

 $('yourpickerid').datepicker({ format: 'dd/mm/yyyy', }).on('changeDate', function(e){ $(this).datepicker('hide'); }); 

请参阅http://bootstrap-datepicker.readthedocs.org/en/latest/events.html#changedate

 $('#input').datepicker({autoclose:true}); 

如果你打算在全局范围内重写日历的行为,请尝试编辑Datepicker函数(在我的例子中是82行),

  this.autoclose = false; 

  this.autoclose = true; 

对我来说工作得很好,因为我希望所有的日历实例都具有相同的行为。

问题可以被阻止,通过这个linese阻止input元素的隐藏事件:

 var your_options = { ... }; $('.datetimepicker').datetimepicker(your_options).on('hide', function (e) { e.preventDefault(); e.stopPropagation(); }); 
  $('yourpickerid').datetimepicker({ pickTime: false }).on('changeDate', function (e) { $(this).datetimepicker('hide'); }); 

closuresdatetimepicker当dateselect(datetimepicker显示date与时间)

 $('.datepicker').datepicker({ autoclose: true, closeOnDateSelect: true }); 

您可以更改源代码bootstrap-datepicker.js。 添加this.hide(); 像ne

 if (this.viewMode !== 0) { this.date = new Date(this.viewDate); this.element.trigger({ type: 'changeDate', date: this.date, viewMode: DPGlobal.modes[this.viewMode].clsName }); this.hide();//here 

}

我有一个完美的解决scheme:

 $('#Date_of_Birth').datepicker().on('changeDate', function (e) { if(e.viewMode === 'days') $(this).blur(); }); 

即使我写了格式:'YYYY-MM-DD',仍然显示时钟的问题,我必须设置pickTime:false,并在改变后 – >隐藏我必须专注 – >显示

 $('#VBS_RequiredDeliveryDate').datetimepicker({ format: 'YYYY-MM-DD', pickTime: false }); $('#VBS_RequiredDeliveryDate').on('change', function(){ $('.datepicker').hide(); }); $('#VBS_RequiredDeliveryDate').on('focus', function(){ $('.datepicker').show(); }); 

对于date时间select器

 $('yourpickerid').datetimepicker({ format: 'dd/mm/yyyy', }).on('changeDate', function(e){ $(this).datetimepicker('hide'); }); 

我改为datetimepicker和格式为“DD / MM / YYYY”

 $("id").datetimepicker({ format: 'DD/MM/YYYY', }).on('changeDate', function() { $('.datepicker').hide(); }); 

至less在我使用的2.2.3版本中,您必须使用autoClose而不是autoclose 。 信案大事。

  1. 只需打开bootstrap-datepicker.js
  2. find: var defaults = $.fn.datepicker.defaults
  3. 设置autoclose: true

保存并刷新您的项目,这应该做的。

 $('.datepicker').datepicker({ autoclose: true }); 
  • twitter引导3 jquery最低版本
  • Bootstrap 3:仅在较小的屏幕上推/拉列
  • 响应式网站在手机上全长缩小
  • 如何完全破坏bootstrap模态窗口?
  • 垂直居中Bootstrap模态窗口
  • Bootstrap Modal立即消失
  • 如何在twitter引导中正确清理浮动?
  • Twitter Bootstrap:如何使用jQuery以编程方式closures模式/ popover
  • 如何将Twitter Bootstrap工具提示绑定到dynamic创build的元素?
  • 如何使用Twitter Bootstrap的popup窗口来显示图片?
  • Twitter Bootstrap文本字段的高度太小?