jQuery-UI datepicker默认日期

Question

我有jQuery-UI datepicker的问题，我已经搜索和搜索，但我没有找到答案。我有以下代码：

<script type="text/javascript"> 
$(function() {    
    $("#birthdate").datepicker({ 
     changeMonth: true, 
     changeYear: true, 
     yearRange: '1920:2010', 
     dateFormat : 'dd-mm-yy', 
     defaultDate: '01-01-1985' 
    }); 
}); 
</script> 

我想，当在#birthdate输入用户点击所选择的当前日期为01-01-1985，现在它设置为当前日期。

Answer 1

尝试传入Date对象。我不明白为什么它不格式工作，你已经进入：

<script type="text/javascript"> 
$(function() {    
    $("#birthdate").datepicker({ 
     changeMonth: true, 
     changeYear: true, 
     yearRange: '1920:2010', 
     dateFormat : 'dd-mm-yy', 
     defaultDate: new Date(1985, 00, 01) 
    }); 
}); 
</script> 

http://api.jqueryui.com/datepicker/#option-defaultDate

通过 Date对象或作为一个字符串指定为实际的日期 当前日期格式或距离今天（例如+7）日期的 天或数值和周期的字符串 的数目（'y'多年， 'm'数月，'w'数周，'d'为 天，例如'+ 1m + 7d'），或者为null 今天。

Answer 2

您可以尝试下面的代码。

它会使默认日期成为您正在查找的日期。

$('#birthdate').datepicker("setDate", new Date(1985,01,01)); 

Answer 3

眼看：

设置为在第一开口突出，如果该字段为空的日期。通过Date对象指定实际日期，或者在当前的dateFormat中指定一个实际的日期，或者指定从今天开始的天数（例如+7）或者一串值和期间（'y'多年，'m'多个月， 'w'表示数周，'d'表示数天，例如'+ 1m + 7d'），或者对于今天为空。

如果当前的日期格式为无法识别，你仍然可以使用使用new Date(year, month, day)

在您的例子Date对象，这应该工作（我没有测试）：

<script type="text/javascript"> 
$(function() {    
    $("#birthdate").datepicker({ 
     changeMonth: true, 
     changeYear: true, 
     yearRange: '1920:2010', 
     dateFormat : 'dd-mm-yy', 
     defaultDate: new Date(1985,01,01) 
    }); 
}); 
</script> 

Answer 4

jQuery UI Datepicker被编码为始终使用类ui-state-highlight突出显示用户的本地日期。没有内置的选项来改变这一点。

一种方法，在其他的答案相关问题的描述类似，是覆盖CSS该类以符合您的主题ui-state-default，例如：

.ui-state-highlight { 
    border: 1px solid #d3d3d3; 
    background: #e6e6e6 url(images/ui-bg_glass_75_e6e6e6_1x400.png) 50% 50% repeat-x; 
    color: #555555; 
} 

然而，这不是，如果你非常有帮助使用动态主题，或者如果你的意图是突出不同的一天（例如，“今天”是基于你的服务器时钟而不是客户端）。

另一种方法是覆盖负责突出显示当天的日期选择器原型。

假设您正在使用UI javascript的最小化版本，以下片段可以解决这些问题。

---

如果你的目标是防止完全凸显当前日期：

// copy existing _generateHTML method 
var _generateHTML = jQuery.datepicker.constructor.prototype._generateHTML; 
// remove the string "ui-state-highlight" 
_generateHtml.toString().replace(' ui-state-highlight', ''); 
// and replace the prototype method 
eval('jQuery.datepicker.constructor.prototype._generateHTML = ' + _generateHTML); 

这改变从相关的代码（处于最小化状态的可读性）：

[...](printDate.getTime() == today.getTime() ? ' ui-state-highlight' : '') + [...] 

到

[...](printDate.getTime() == today.getTime() ? '' : '') + [...] 

---

如果你的目标是要改变的 “今天” 日期选择器的定义：

var useMyDateNotYours = '07/28/2014'; 
// copy existing _generateHTML method 
var _generateHTML = jQuery.datepicker.constructor.prototype._generateHTML; 
// set "today" to your own Date()-compatible date 
_generateHTML.toString().replace('new Date,', 'new Date(useMyDateNotYours),'); 
// and replace the prototype method 
eval('jQuery.datepicker.constructor.prototype._generateHTML = ' + _generateHTML); 

这改变从相关的代码（处于最小化状态的可读性）：

[...]var today = new Date();[...] 

到

[...]var today = new Date(useMyDateNotYours);[...] 
// Note that in the minimized version, the line above take the form `L=new Date,` 
// (part of a list of variable declarations, and Date is instantiated without parenthesis) 

而不是useMyDateNotYours你当然也可以注入一个字符串，函数或任何适合你需要的东西。

Answer 5

如果要根据某些服务器时间将突出显示的日期更新为不同日期，可以覆盖日期选择器代码以允许使用名为localToday的新自定义选项或任何您想要命名的日期。

一个小调整到所选择的答案中jQuery UI DatePicker change highlighted "today" date

// Get users 'today' date 
var localToday = new Date(); 
localToday.setDate(tomorrow.getDate()+1); // tomorrow 

// Pass the today date to datepicker 
$("#datepicker").datepicker({ 
    showButtonPanel: true, 
    localToday: localToday // This option determines the highlighted today date 
}); 

我已经覆盖2层日期选择器的方法来有条件地使用新设置为“今天”时代，而不是一个new Date()。新设置称为localToday。

覆盖$.datepicker._gotoToday和$.datepicker._generateHTML这样的：

$.datepicker._gotoToday = function(id) { 
    /* ... */ 
    var date = inst.settings.localToday || new Date() 
    /* ... */ 
} 

$.datepicker._generateHTML = function(inst) { 
    /* ... */ 
    tempDate = inst.settings.localToday || new Date() 
    /* ... */ 
} 

这里有一个demo其中显示了完整的代码和用法：http://jsfiddle.net/NAzz7/5/

Answer 6

Jquery的日期选择器defaultDate只设置您选择日历上的默认日期当你点击你的领域时弹出。 如果您希望在用户点击字段之前将输入的默认日期输入到您的输入中，那么您应该在字段中输入val（）。 事情是这样的：

$("#searchDateFrom").datepicker({ defaultDate: "-1y -1m -6d" }); 
$("#searchDateFrom").val((date.getMonth()) + '/' + (date.getDate() - 6) + '/' + (date.getFullYear() - 1)); 

Answer 7

$("#birthdate").datepicker("setDate", new Date(1985,01,01))