Question

我正在使用jQuery UI datepicker。

<input id="sent_date" type="text" value="01/01/2001">

像这样初始化。

$( "#sent_date" ).datepicker({
    changeMonth: true,
    changeYear: true,
    dateFOrmat: "mm/dd/yy",
    defaultDate: new Date()
});

现在，datepicker在＆＃34; 01/01/1001＆＃34;开放。如果我像这样改变我的JavaScript

$( "#sent_date" ).datepicker({
    changeMonth: true,
    changeYear: true,
    dateFOrmat: "mm/dd/yy",
    defaultDate: new Date()
}).datepicker("setDate", 0);

现在，datepicker将于＆＃34; 11/08 / 2013＆＃34;开放。但我的文本框也改为＆＃34; 11/08 / 2013＆＃34;
JSFiddle：http://jsfiddle.net/codovations/3KutM/

所以，我的问题是，

如何以今天的日期（2013年8月11日）打开我的日期选择器，而不更改显示的文本框日期（01/01/2001 ）？

Answer 1

使用beforeShow选项更新打开日期选择器的日期。

$( "#sent_date" ).datepicker({
    changeMonth: true,
    changeYear: true,
    dateFOrmat: "mm/dd/yy",
    beforeShow: function(el, dp) {
        dp.datepicker("setDate", 0);
    }
});

Answer 2

看起来毕竟JQuery UI DatePicker中没有afterShow方法。由于猴子修补看起来有点牵强，最后像这样使用了beforeShow和onClose事件。

var elm = {}, oldDate = "";
$(".dp-date").datepicker({
    changeMonth: true,
    changeYear: true,
    dateFOrmat: "mm/dd/yy",
    defaultDate: new Date(),
    beforeShow: function (el, dp) {
        elm = $(el);
        oldDate = $.trim(elm.val());
        elm.val("");
    },
    onClose: function (dateText, dp) {
        if ($.trim(elm.val()) === "") {
            elm.val(oldDate);
        }
        oldDate = "";
    }
});

JSFiddle：http://jsfiddle.net/codovations/4KSKr/

使用当前日期发出打开jQuery UI datepicker

2 个答案: