在jQuery datepicker中设置minDate没有任何反应? [英] Nothing happen on setting minDate in jquery datepicker?
问题描述
我这样写..
I written like this..
<script>
$(function() {
$('#from').datepicker({
defaultDate: "+5d",
changeMonth: true,
numberOfMonths:1 ,
minDate:"+0d",
dateFormat: 'DD, MM d, yy',
onSelect: function(selectedDate) {
var option = this.id == "from" ? "minDate" : "maxDate";
var instance = $(this).data("datepicker");
var date = $.datepicker.parseDate(instance.settings.dateFormat || $.datepicker._defaults.dateFormat, selectedDate, instance.settings);
dates.not(this).datepicker("option", option, date);
}
});
});
$(function() {
$('#to').datepicker({
defaultDate: "+5d",
changeMonth: true,
numberOfMonths:1 ,
minDate:"+0d",
dateFormat: 'DD, MM d, yy',
onSelect: function(selectedDate) {
var option = this.id == "from" ? "minDate" : "maxDate";
var instance = $(this).data("datepicker");
var date = $.datepicker.parseDate(instance.settings.dateFormat || $.datepicker._defaults.dateFormat, selectedDate, instance.settings);
dates.not(this).datepicker("option", option, date);
}
});
});
function callme(id){
var temp1 = "#" + id;
if(temp1 == "#from"){
$("#to").unbind();
}
else{
var temp = $("#from").val();
var msecsInADay = 86400000;
var startDate = new Date(temp);
var endDate = new Date(startDate.getTime() + msecsInADay);
var t = endDate.getDate() + '/' + (endDate.getMonth()+1) + '/' + endDate.getFullYear();
$('#to').datepicker({minDate: new Date(t)});
$('#to').datepicker().datepicker("show");
}
}
</script>
</head>
<body>
<label>date</label><input id="from" type="text" onclick="callme(this.id)"/>
<label>return</label><input id="to" type="text" onclick="callme(this.id)" />
现在我想要的是....
当我选择第一个日期时. [今天日期之前的[#from]上的含义]应该在日历中禁用.
现在，当我选择日历日期中的第二个日期[在"#to"中表示"时，应该开始一天.然后是前一个日期.
Now what I want is....
when I select the first date. [means on "#from"] before today's dates should be disabled in calendar.
now when I select the second date [means on "#to"] in calendar date should start one day plus. then previous date.
但是这里的最小日期没有改变.
But here the min date has not changed.
提前谢谢...
推荐答案
如果我理解您的问题(和代码，因为所提供的代码比您的说明要多)，您需要以下行为:
If i understand your question (and code, because the provided code does more than your specification) you want the following behaviour:
- 在
#from中选择日期F时，您只能选择在#to中大于F的日期. - 在
#to中选择日期T时，在#from中不能选择大于或等于
T的日期.
- When a date,
F, in#fromis selected, you should only be able to select dates greater thanFin#to. - When a date,
T, in#tois selected, no dates greater than or equal toTshould be selectable in#from
此代码将执行以下操作:
This code will do this:
$(function() {
$('#from').datepicker({
defaultDate: '+5d',
changeMonth: true,
numberOfMonths:1,
minDate:'+0d',
dateFormat: 'DD, MM d, yy',
onClose: function(dateText, inst) {
if (dateText !== '') {
try {
var fromDate = $.datepicker.parseDate(inst.settings.dateFormat, dateText, inst.settings);
fromDate.setDate(fromDate.getDate() + 1);
$('#to').datepicker('option', 'minDate', fromDate);
}
catch (err) {
console.log(err);
}
}
else {
//If #from is empty, restore the original limit in #to
$('#to').datepicker('option', 'minDate', '+0d');
}
}
});
$('#to').datepicker({
defaultDate: '+5d',
changeMonth: true,
numberOfMonths:1,
minDate:'+0d',
dateFormat: 'DD, MM d, yy',
onClose: function(dateText, inst) {
if (dateText !== '') {
try {
var toDate = $.datepicker.parseDate(inst.settings.dateFormat, dateText, inst.settings);
toDate.setDate(toDate.getDate() - 1);
$('#from').datepicker('option', 'maxDate', toDate);
}
catch (err) {
console.log(err);
}
}
else {
//If #to is empty, remove the limit in #from
$('#from').datepicker('option', 'maxDate', null);
}
}
});
});
这两个onClose函数非常相似，可以归纳为一个函数，但是我认为更容易理解这种方式.
The two onClose functions are pretty similar and could be generalized into one function, but I think it's easier to understand what's going on this way.
此外，不再需要#from或#to中的onClick处理程序.
Also, there's no need for the onClick handler in #from or #to any longer.
这篇关于在jQuery datepicker中设置minDate没有任何反应?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
