我正在尝试使用UI日期选择器选择日期范围。
在from / to字段中,人们不应该查看或选择当天之前的日期。
这是我的代码:
$(function() {
var dates = $( "#from, #to" ).datepicker({
defaultDate: "+1w",
changeMonth: true,
numberOfMonths: 1,
onSelect: function( selectedDate ) {
var option = this.id == "from" ? "minDate" : "maxDate",
instance = $( this ).data( "datepicker" ),
date = $.datepicker.parseDate(
instance.settings.dateFormat ||
$.datepicker._defaults.dateFormat,
selectedDate, instance.settings );
dates.not( this ).datepicker( "option", option, date );
}
});
});
有人可以告诉我如何禁用当前日期之前的日期。
答案 0 :(得分:103)
初始化日期选择器时,您必须创建一个新的日期对象并将其设置为minDate
<label for="from">From</label> <input type="text" id="from" name="from"/> <label for="to">to</label> <input type="text" id="to" name="to"/>
var dateToday = new Date();
var dates = $("#from, #to").datepicker({
defaultDate: "+1w",
changeMonth: true,
numberOfMonths: 3,
minDate: dateToday,
onSelect: function(selectedDate) {
var option = this.id == "from" ? "minDate" : "maxDate",
instance = $(this).data("datepicker"),
date = $.datepicker.parseDate(instance.settings.dateFormat || $.datepicker._defaults.dateFormat, selectedDate, instance.settings);
dates.not(this).datepicker("option", option, date);
}
});
修改 - 现在,根据您的评论,它可以按预期工作http://jsfiddle.net/nicolapeluchetti/dAyzq/1/
答案 1 :(得分:67)
声明dateToday变量并使用Date()函数来设置它。 然后使用该变量分配给minDate,这是datepicker的参数。
var dateToday = new Date();
$(function() {
$( "#datepicker" ).datepicker({
numberOfMonths: 3,
showButtonPanel: true,
minDate: dateToday
});
});
就是这样......上面的回答真的很有帮助......坚持下去......
答案 2 :(得分:45)
$('#datepicker-dep').datepicker({
minDate: 0
});
minDate:0
适合我。
答案 3 :(得分:16)
使用“minDate”选项限制最早的允许日期。 值“0”表示今天(从今天起0天):
$(document).ready(function () {
$("#txtdate").datepicker({
minDate: 0,
// ...
});
});
答案 4 :(得分:7)
添加到此:
如果您还需要阻止用户手动键入过去的日期,这是一种可能的解决方案。这就是我们最终做的事情(基于@Nicola Peluchetti的回答)
var dateToday = new Date();
$("#myDatePickerInput").change(function () {
var updatedDate = $(this).val();
var instance = $(this).data("datepicker");
var date = $.datepicker.parseDate(instance.settings.dateFormat || $.datepicker._defaults.dateFormat, updatedDate, instance.settings);
if (date < dateToday) {
$(this).datepicker("setDate", dateToday);
}
});
如果用户手动输入过去的日期,这样做的目的是将值更改为今天的日期。
答案 5 :(得分:4)
Live Demo,试试这个,
$('#from').datepicker(
{
minDate: 0,
beforeShow: function() {
$(this).datepicker('option', 'maxDate', $('#to').val());
}
});
$('#to').datepicker(
{
defaultDate: "+1w",
beforeShow: function() {
$(this).datepicker('option', 'minDate', $('#from').val());
if ($('#from').val() === '') $(this).datepicker('option', 'minDate', 0);
}
});
答案 6 :(得分:3)
这是一种简单的方法
$('#datepicker').datepicker('setStartDate', new Date());
我们也可以禁用未来的日子
$('#datepicker').datepicker('setEndDate', new Date());
答案 7 :(得分:2)
设置datepicker的startDate属性,它可以工作,下面是工作代码
$(function(){
$('#datepicker').datepicker({
startDate: '-0m'
//endDate: '+2d'
}).on('changeDate', function(ev){
$('#sDate1').text($('#datepicker').data('date'));
$('#datepicker').datepicker('hide');
});
})
答案 8 :(得分:2)
jQuery API documentation - datepicker
最短可选日期。设置为null
时,没有最低限度。
支持多种类型:
日期:包含最短日期的日期对象
数量:从今天开始的几天。例如,2
代表two days
从今天开始,-1
代表yesterday
字符串:由dateFormat
选项定义的格式的字符串,或相对日期。
相对日期必须包含价值和期间对;有效期为y
为years
,m
为months
,w
为weeks
,d
为days
}。例如,+1m +7d
代表来自one month and seven days
的{{1}}。
为了不显示今天以外的其他日期
today
答案 9 :(得分:2)
&#34;的 MINDATE 强>&#34;属性应该用于禁用jquery datepicker中的传递日期。
minDate:new Date()或minDate:&#39; 0&#39;是关键。
Ex:
$(function() {
$( "#datepicker" ).datepicker({minDate: new Date()});
});
OR
$(function() {
$( "#datepicker" ).datepicker({minDate: 0});
});
答案 10 :(得分:2)
只需替换您的代码:
旧代码:
$("#dateSelect").datepicker({
showOtherMonths: true,
selectOtherMonths: true,
changeMonth: true,
changeYear: true,
showButtonPanel: true,
dateFormat: 'yy-mm-dd'
});
新代码:
$("#dateSelect").datepicker({
showOtherMonths: true,
selectOtherMonths: true,
changeMonth: true,
changeYear: true,
showButtonPanel: true,
dateFormat: 'yy-mm-dd',
minDate: 0
});
答案 11 :(得分:1)
通过设置startDate: new Date()
$('.date-picker').datepicker({
defaultDate: "+1w",
changeMonth: true,
numberOfMonths: 1,
...
startDate: new Date(),
});
答案 12 :(得分:0)
你必须将当前日期声明为这样的变量
$(function() {
var date = new Date();
var currentMonth = date.getMonth();
var currentDate = date.getDate();
var currentYear = date.getFullYear();
$('#datepicker').datepicker({
minDate: new Date(currentYear, currentMonth, currentDate)
});
})
答案 13 :(得分:0)
$( "#date" ).datetimepicker({startDate:new Date()}).datetimepicker('update', new Date());
new Date()
:函数获取今天的日期
上一个日期被锁定。
100%工作
答案 14 :(得分:0)
我创建了禁用上一个日期的功能,禁用灵活的周末日(如周六,周日)
我们正在使用jQuery UI datepicker插件的 beforeShowDay 方法。
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
var NotBeforeToday = function(date) {
var now = new Date(); //this gets the current date and time
if (date.getFullYear() == now.getFullYear() && date.getMonth() == now.getMonth() && date.getDate() >= now.getDate() && (date.getDay() > 0 && date.getDay() < 6) )
return [true,""];
if (date.getFullYear() >= now.getFullYear() && date.getMonth() > now.getMonth() && (date.getDay() > 0 && date.getDay() < 6))
return [true,""];
if (date.getFullYear() > now.getFullYear() && (date.getDay() > 0 && date.getDay() < 6))
return [true,""];
return [false,""];
}
jQuery("#datepicker").datepicker({
beforeShowDay: NotBeforeToday
});
&#13;
今天的日期是9月15日。我已经在星期六和星期日休息了。
答案 15 :(得分:0)
您可以简单地使用
startDate: 'today'
对我来说很好。