我正在尝试显示两个日期选择器并根据第一个选择日期datepicker>

时间:2017-04-15 07:42:54

标签: jquery jquery-ui-datepicker



$(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>
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
&#13;
&#13;
&#13;

我正在尝试显示两个日期选择器并根据第一个选择的日期选择器禁用第二个日期选择器日期,我想显示错误&#34;仅在2000年之后选择年份&#34;当我们选择1990年?任何人都可以帮忙吗?

2 个答案:

答案 0 :(得分:0)

你可以在这里查看

$(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>

答案 1 :(得分:0)

立即尝试

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');