Question

如何在Bootstrap Datepicker中设置默认日期？

我想设定一个日期：2006年12月24日

当我打开datepicker时，它应该在日历上显示这个日期选择。

代码：

$(function()
{

    $('#dob').datepicker(
    {
        <!--viewMode: "years",-->
        onRender: function(date) 
        {
         //return date.valueOf() > now.valueOf() ? 'disabled' : '';
        }       
    }
    );
});

这是一个小提琴：

http://jsfiddle.net/ymp5D/204/

Answer 1

你可以这样做：

$('#dob').datepicker('setDate', new Date(2006, 11, 24));
$('#dob').datepicker('update');
$('#dob').val('');

<强> Fiddle Demo

Answer 2

如果要将更改设置为全局，请在bootstrap-datepicker.js中查找以下内容：

function UTCToday(){
var today = new Date();
return UTCDate(today.getFullYear(), today.getMonth(), today.getDate());

和您日期中的硬编码，例如：

function UTCToday(){
var today = new Date();
return UTCDate(2006, 00, 01);

将于2006年1月1日开放。请注意，出于某种原因，1月份是＆＃39; 00＆＃39;而不是＆＃39; 01＆＃39;。

Answer 3

以上接受的解决方案已经过时，为了帮助拥有最新文件的其他人，如果您有版本4或更新版本，并且您想要调用方法，这里是bootstrap datetimepicker方法的示例：

$('#eventDate').data("DateTimePicker").date(moment(date).format('YYYY-MM-DD'));

bootstrap.datetimepicker格式选项示例：

 $('#eventDate').datetimepicker({ format: 'YYYY-MM-DD' });

更多见这里（但没有有效样本:)）： http://eonasdan.github.io/bootstrap-datetimepicker/Options/

Answer 4

经过长时间的搜索后，这对我有用。此解决方案适用于Bootstrap datetimepicker版本4.当您必须在输入字段中设置默认日期时。

HTML

"input type='text' class="form-control" id='datetimepicker5' placeholder="Select to date" value='<?php echo $myDate?>'// $myDate is having value '2016-02-23' "

注意 - 如果您使用php进行编码，则可以使用php设置输入日期字段的值，但是当您对其应用datetimepicker（）函数时，datetimepicker会将其设置回当前日期。因此，为了防止它，使用给定的JS代码

JAVASCRIPT

<script>
$('#datetimepicker5').datetimepicker({
    useCurrent: false, //this is important as the functions sets the default date value to the current value 
    format: 'YYYY-MM-DD'
});
</script>

Answer 5

在我的版本中，如果您将val放入输入中，日历会自动更新。

$('#birthdate').val("01/01/2001");

Answer 6

我想在创业时设定一个日期，而提到的方法并不起作用。显示了日期，但是当我点击该对象时，未选择日期。

所以我做的是检索库的Datepicker对象，并在其上应用_setDate方法：

$('#dob').data("datepicker")._setDate(date);

但要使其工作，日期对象必须在UTC时间午夜，所以在我做之前：

var date = new Date();
date.setUTCHours(0,0,0,0);

然后它奏效了。

Answer 7

您可以简单地指定一个值（与您一起输入标签，它应该可以正常工作

<input type="text" class="form-control" value="22-05-2017">

Answer 8

一种解决方法：

<div class="form-group">
  <input type="text" class="form-control datepicker" name="arrivalDate" id="datepicker_arrival">
</div>

因此，在您的js中添加以下内容：

$('.datepicker').datepicker({
   language: 'fr',
   todayHighlight: true,
   orientation: "bottom auto",
   startDate: "today",
   autoclose: true,
});
$('#datepicker_arrival').datepicker('setDate', new Date('2020/04/04'));

Answer 9

当我设置为默认日期时，我不想触发changeDate事件，所以我使用了

$('#calendarDatePicker').data("date", new Date());

然后实例化日期选择器

$('#calendarDatePicker').datepicker();

设置默认日期Bootstrap Datepicker

9 个答案: