如何预填充今天的datejQuery Datepicker文本框?

我有一个非常简单的jQuery Datepicker日历:

$(document).ready(function(){ $("#date_pretty").datepicker({ }); }); 

当然在HTML中…

 <input type="text" size="10" value="" id="date_pretty"/> 

当用户打开日历时,今天的date很好地突出显示,但是如何让jQuery在页面加载时预先填充文本框本身的date,而不需要用户执行任何操作? 99%的时间,今天的date默认将是他们想要的。

更新:有些报告不再适用于Chrome。

这是简明扼要的工作:

 $(".date-pick").datepicker('setDate', new Date()); 

您必须首先调用datepicker()> 然后使用“setDate”获取当前date。

 $(".date-pick").datepicker(); $(".date-pick").datepicker("setDate", new Date()); 

或者在你的datepicker初始化之后链接你的setDate方法调用,正如在这个答案的评论中指出的那样

 $('.date-pick').datepicker({ /* optional option parameters... */ }) .datepicker("setDate", new Date()); 

不会与刚刚工作

 $(".date-pick").datepicker("setDate", new Date()); 

注意这里介绍可接受的setDate参数

 var myDate = new Date(); var prettyDate =(myDate.getMonth()+1) + '/' + myDate.getDate() + '/' + myDate.getFullYear(); $("#date_pretty").val(prettyDate); 

似乎工作,但可能有更好的办法。

setDate()方法设置date并更新关联的控件。 这里是如何:

 $("#datepicker1").datepicker({ dateFormat: "yy-mm-dd" }).datepicker("setDate", "0"); 

演示

正如文档中所提到的, setDate()愉快地接受JavaScript Date对象,数字或string:

新date可以是date对象或当前date格式的string(例如'01 / 26/2009'),距今天的天数(例如+7)或者一串值和句点('y'年,'m'为几个月,'w'为几周,'d'为天,例如'+ 1m + 7d'),或者为null来清除所选date。

如果你想知道,在构造函数设置defaultDate属性不会更新关联的控件。

设置到今天

 $('#date_pretty').datepicker('setDate', '+0'); 

设置为昨天

 $('#date_pretty').datepicker('setDate', '-1'); 

今天的date 之前之后的任何天数都是如此。

请参阅jQuery UI>方法> setDate 。

解决scheme是:

 $(document).ready(function(){ $("#date_pretty").datepicker({ }); var myDate = new Date(); var month = myDate.getMonth() + 1; var prettyDate = month + '/' + myDate.getDate() + '/' + myDate.getFullYear(); $("#date_pretty").val(prettyDate); }); 

感谢grayghost!

此代码将确保使用您的dateselect器的格式:

 $('#date-selector').datepicker('setDate', new Date()); 

没有必要重新应用格式,它使用datepicker预定义 – 一个由你在datepicker初始化(如果你已经分配它!);)

这个为我工作。

 $('#inputName') .datepicker() .datepicker('setDate', new Date()); 
 $('input[name*="date"]').datepicker({ dateFormat: 'dd-mm-yy', changeMonth: true, changeYear: true, beforeShow: function(input, instance) { $(input).datepicker('setDate', new Date()); } }); 

David K Egghead的代码工作完美,谢谢!

 $(".date-pick").datepicker(); $(".date-pick").datepicker("setDate", new Date()); 

我也设法修剪它,它也工作:

 $(".date-pick").datepicker().datepicker("setDate", new Date()); 

为了将dateselect器设置为加载时的某个默认时间(在我的情况下是当前date),然后可以select另一个date的语法是:

  $(function() { // initialize the datapicker $("#date").datepicker(); // set the time var currentDate = new Date(); $("#date").datepicker("setDate",currentDate); // set the options for the button $("#date").datepicker("option",{ dateFormat: 'dd/mm', showOn: "button", // whatever option Or event you want }); }); 

只是想我会增加我的两分钱。 select器在添加/更新表单上使用,因此如果编辑现有logging,则需要显示来自数据库的date,如果没有,则显示今天的date。 下面的工作对我来说很好:

  $( "#datepicker" ).datepicker(); <?php if (!empty($oneEVENT['start_ts'])): ?> $( "#datepicker" ).datepicker( "setDate", "<?php echo $startDATE; ?>" ); <? else: ?> $("#datepicker").datepicker('setDate', new Date()); <?php endif; ?> }); 

尝试这个

 $(this).datepicker("destroy").datepicker({ changeMonth: false, changeYear: false,defaultDate:new Date(), dateFormat: "dd-mm-yy", showOn: "focus", yearRange: "-5:+10" }).focus(); 

要预先填充date,首先必须初始化datepicker,然后传递setDate参数值。

 $("#date_pretty").datepicker().datepicker("setDate", new Date()); 
 $(function() { $('.date-pick').datePicker().val(new Date().asString()).trigger('change'); }); 

资料来源: http : //www.kelvinluck.com/assets/jquery/datePicker/v2/demo/datePickerDefaultToday.html

 var prettyDate = $.datepicker.formatDate('dd-M-yy', new Date()); alert(prettyDate); 

将prettyDate分配给必要的控件。

你有两个select:

选项A)只有当您点击input时,才会在日历中标记为“有效”。

Js

 $('input.datepicker').datepicker( { changeMonth: false, changeYear: false, beforeShow: function(input, instance) { $(input).datepicker('setDate', new Date()); } } ); 

Css

 div.ui-datepicker table.ui-datepicker-calendar .ui-state-active, div.ui-datepicker table.ui-datepicker-calendar .ui-widget-content .ui-state-active { background: #1ABC9C; border-radius: 50%; color: #fff; cursor: pointer; display: inline-block; width: 24px; height: 24px; }​ 

选项B)默认input今天。 你必须先填充dateselect器。

  $(“input.datepicker”)。datepicker()。datepicker(“setDate”,new Date()); 

这对我.datepicker('setDate', new Date());因为有时我有麻烦调用.datepicker('setDate', new Date()); 因为它如果如果我有datepicker已经configuration参数混乱。

 $("#myDateText").val(moment(new Date()).format('DD/MM/YYYY'));