我正在尝试显示两个日期选择器并根据第一个选择的日期日期选择器禁用第二个日期选择器日期>答案

【问题标题】：I am trying to display two date pickers and disable the 2nd datepicker dates based on first selected date datepicker>我正在尝试显示两个日期选择器并根据第一个选择的日期日期选择器禁用第二个日期选择器日期>
【发布时间】：2017-04-15 07:42:54
【问题描述】：

$(function(){
selected = function(){
var selected = new Date($("#start").datepicker('getDate'));
var b = selected.getFullYear();
console.log(b);
if (b <=2000)
{
$("#error").show().addClass("blue");
//$("#error")
}else
{
$("#error").hide();
}
}
});
$(function(){
$("#start").datepicker({
changeMonth: true,
changeYear : true,
dateFormat : "dd-mm-yy",
yearRange  : "1995:2020",
onSelect: function(selected){
$("#end").datepicker("option","minDate", selected)
}
});
$("#end").datepicker({
changeMonth: true,
changeYear : true,
dateFormat : "dd-mm-yy",
yearRange  : "1995:2020",
onSelect: function(selected){
$("#start").datepicker("option","maxDate", selected)
}
});
});
</script>
Start :<input id = "start" type = "text" >
END   :<input id = "end"   type = "text">
<p id = "error" style = "display :none">select after 1990 only</p>
</body>
<style>
.blue 
{
color: blue;
}
</style>

&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;

我试图显示两个日期选择器并根据第一个选择的日期选择器禁用第二个日期选择器日期，当我们选择 1990 年时，我想显示错误“仅在 2000 年之后选择年份”？有人可以帮忙吗？

【问题讨论】：

标签： jquery jquery-ui-datepicker

【解决方案1】：

你可以在这里查看

$(function(){
$("#start").datepicker({
changeMonth: true,
changeYear : true,
dateFormat : "dd-mm-yy",
yearRange  : "1995:2020",
onSelect: function(selected){

var selected = new Date($("#start").datepicker('getDate'));
var b = selected.getFullYear();
console.log(b);
if (b <=2000)
{
$("#error").show().addClass("blue");
//$("#error")
}else
{
$("#error").hide();
}



}
});
$("#end").datepicker({
changeMonth: true,
changeYear : true,
dateFormat : "dd-mm-yy",
yearRange  : "1995:2020",
onSelect: function(selected){
$("#start").datepicker("option","maxDate", selected)
}
});
});

.blue 
{
color: blue;
}

<link href="http://code.jquery.com/ui/1.10.0/themes/base/jquery-ui.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.0/jquery-ui.js"></script>

Start :<input id = "start" type = "text" >
END   :<input id = "end"   type = "text">
<p id = "error" style = "display :none">select after 1990 only</p>

【讨论】：

您的代码正在运行，但我想在我们选择 2000 年之前显示错误消息

【解决方案2】：

立即尝试

var nowTemp = new Date();
var now = new Date(nowTemp.getFullYear(), nowTemp.getMonth(), nowTemp.getDate(), 0, 0, 0, 0);

var checkin = $('#dpd1').datepicker({
  onRender: function(date) {
    return date.valueOf() < now.valueOf() ? 'disabled' : '';
  }
}).on('changeDate', function(ev) {
  if (ev.date.valueOf() > checkout.date.valueOf()) {
    var newDate = new Date(ev.date)
    newDate.setDate(newDate.getDate() + 1);
    checkout.setValue(newDate);
  }
  checkin.hide();
  $('#dpd2')[0].focus();
}).data('datepicker');
var checkout = $('#dpd2').datepicker({
  onRender: function(date) {
    return date.valueOf() <= checkin.date.valueOf() ? 'disabled' : '';
  }
}).on('changeDate', function(ev) {
  checkout.hide();
}).data('datepicker');

【讨论】：