javascript - Jquery Datepicker 仅限于另一个日期选择器的月份和年份

Question

我有一个问题。我需要一个日期选择器来限制用户选择日期。

所以它是这样的:

1) 首先输入，我应该可以选择我想要的任何日期、月份和年份。

2) 第二个输入，如果它大于第一个输入的日期，我应该能够从第一个输入的同一月/年中选择一天。否则提示错误。

编辑 - 代码: http://jsfiddle.net/wc6jcpka/

var dates = $("input[id$='startDate'], input[id$='endDate']").datepicker({
   dateFormat: 'dd/mm/yy',
   changeMonth: true,
   changeYear: true,
   onSelect: function (selectedDate) {
      var option = this.id == $("input[id$='startDate']")[0].id ? "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);
      }
   });

Answer 1

以下将根据您的要求工作:

var txtTranDate = $("#startDate");

var txtTranDateTo = $("#endDate");

txtTranDate.datepicker({
    defaultDate: 0,
    changeMonth: true,
    changeYear: true,
    dateFormat: dateFormat,
    maxDate: 0,
    numberOfMonths: 1
}).on("change", function () {
    var dcal = getDate(this);
    if (txtTranDate.val() !== '' && dcal === null) {
        txtTranDate.prop("value", "");
        txtTranDateTo.prop("value", "");
    } else {
        txtTranDateTo.datepicker("option", "minDate", getDate(this));
    }
});

txtTranDateTo.datepicker({
    defaultDate: 0,
    changeMonth: true,
    changeYear: true,
    maxDate: 0,
    dateFormat: dateFormat,
    numberOfMonths: 1
}).on("change", function () {
    var dcal = getDate(this);
    if (txtTranDateTo.val() !== '' && dcal === null) {
        txtTranDate.prop("value", "");
        txtTranDateTo.prop("value", "");
    } else {
        txtTranDate.datepicker("option", "maxDate", getDate(this));
    }
});

UPDATE 检查是否输入有效日期的方法

function getDate(element) {
    var date;
    try {
        date = $.datepicker.parseDate(dateFormat, element.value);
    } catch (error) {
        date = null;
    }

    return date;
}