如何在日期选择器的jQuery

我在这个方式使用datePicker选择日期的未来：如何在日期选择器的jQuery

$("#dataStart").datepicker({ 
beforeShow: function() { $('#ui-datepicker-div').css('z-index',9999); }, 
dateFormat: 'mm/dd/yy'}); 
$("#dataEnd").datepicker({ 
beforeShow: function() { $('#ui-datepicker-div').css('z-index',9999); }, 
dateFormat: 'mm/dd/yy'});

我想强制在未来，而不是过去选择一个日期，是有可能做到这一点？如果是这样，有可能以动态方式更改第二个日期选择器，因此如果用户选择一个日期，则在第二个字段中他必须选择第一个选定日期旁边的日期。我希望我也问我的问题:) 谢谢大家！

来源

2012-02-02 JackTurky

minDate:1应该只允许日期，明天及以后。然后添加一个onselect限制dataEnd：

$("#dataStart").datepicker({ 
    minDate: 1, 
    onSelect: function(theDate) { 
     $("#dataEnd").datepicker('option', 'minDate', new Date(theDate)); 
    }, 
    beforeShow: function() { 
     $('#ui-datepicker-div').css('z-index', 9999); 
    }, 
    dateFormat: 'mm/dd/yy' 
});

参考：http://blog.alagad.com/2009/04/20/playing-with-jquery-datepicker/

例子：http://jsfiddle.net/jtbowden/F39kt/

来源

2012-02-02 21:35:51

datePicker在dataEnd中以这种方式不起作用... – JackTurky 2012-02-02 21:48:24

你是什么意思？ – 2012-02-02 21:49:50

如果我点击输入文本日期选择在dateend不显示 – JackTurky 2012-02-02 21:50:49

var myDate = new Date(); 
myDate.setDate(myDate.getDate()+10); 
var prettyDate =(myDate.getMonth()+1) + '/' + myDate.getDate() + '/' + myDate.getFullYear(); 

$("#thedate").datepicker({dateFormat: 'mm/dd/yy',altFormat: 'yyyymmdd'}); 
$("#thedate").val(prettyDate);

这就是我该怎么做的。 'thedate'是我的日期选择器。我将日期推迟到今天+ 10天。

来源

2012-02-02 21:34:14 Sid

尝试......

var dates=$("#from, #to").datepicker({ 
    changeMonth:true, 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); 
    } 
});

来源

2012-02-02 21:34:53 bmoran

http://jqueryui.com/demos/datepicker/。

看那minDate选项。您可以使用option方法动态设置它。

来源

2012-02-02 21:34:54 Jasper

如果您在beforeShowDay事件日期选择器的返回[虚假]，它禁用的那一天。您可以比较日期和当前日期，并相应地返回[true/false]。

试试这个。

$("#dataStart").datepicker({ 
    beforeShow: function() { 
     $('#ui-datepicker-div').css('z-index',9999); 
    }, 
    dateFormat: 'mm/dd/yy', 
}); 
$("#dataEnd").datepicker({ 
    beforeShow: function() { 
     $('#ui-datepicker-div').css('z-index',9999); 
    }, 
    dateFormat: 'mm/dd/yy', 
    beforeShowDay: function(date){ 
      return [(date > ($("#dataStart").datepicker("getDate") 
          || new Date()))]; 
    } 
});

Demo

来源

2012-02-02 21:35:24 ShankarSangoli

@JackTurky - 检查了这一点。 – ShankarSangoli 2012-02-02 21:50:17

@JackTurky - 添加了比较结束日期和开始日期并相应地禁用日期的代码。如果开始日期不可用，我只是将它与当前日期进行比较。 – ShankarSangoli 2012-02-02 21:55:16

这是一个古老的线程，但它有点得到澄清。可能是因为改变了jQuery UI控件本身，而是对任何人绊倒在此：

要限制datepickers范围将来的日期只 - 设置minDate参数去0

要限制过去的日期只有你将maxDate参数设置为0.

这很好，因为它避免了必须调用new Date()函数，正如本主题其他地方所建议的。

例子：

$('.your_datepicker').datepicker({ 
    minDate: 0 
});

来源

2015-12-04 18:47:57 DrewT

如何在日期选择器的jQuery

回答

相关问题