javascript - jQuery UI 日期选择器范围选择器问题

Question

在this answer的帮助下创建了带有范围选择器的日期选择器当我们选择从“5 月 1 日”到“8 月 1 日”之间的日期时，用户无法更改 5 月 1 日之前的“起始”日期。在这种情况下是否有任何解决方案，而不是不允许用户浏览除最小日期之外的日期。应允许用户转到上一个。日期，但有警告或通知，表明他们选择了错误的日期范围。

代码片段:credit

$(function() {
    $("#from-datepicker").datepicker({
        dateFormat: "dd-M-yy",
        maxDate: "-1d",
        onClose: function (selectedDate) {             
            // Set 'TO' minDate
            $("#to-datepicker").datepicker("option", "minDate", selectedDate);             

            // Set 'TO' maxDate at 3 months if before yesterday
            var dt = new Date($(this).datepicker("getDate"));
            dt.setMonth(dt.getMonth() + 3);
            if(dt < Date.now()) {
                $("#to-datepicker").datepicker("option", "maxDate", dt);
            }
        }
    });
    $("#to-datepicker").datepicker({
        dateFormat: "dd-M-yy",
        maxDate: "-1d",
        onClose: function (selectedDate) {
            // Set 'FROM' maxDate
            $("#from-datepicker").datepicker("option", "maxDate", selectedDate);

            // Set 'FROM' minDate at 3 months if before yesterday
            var dt = new Date($(this).datepicker("getDate"));
            dt.setMonth(dt.getMonth() - 3);
            if(dt < Date.now()) {
                $("#from-datepicker").datepicker("option", "minDate", dt);
            }
        }
    });
});

http://jsfiddle.net/4Ln0cxpq/

Answer 1

尝试一下 JsFiddle

$(function() {
    $("#from-datepicker").datepicker({
        dateFormat: "dd-M-yy",
        onClose: function (selectedDate) {             
            var dt = new Date($(this).datepicker("getDate"));
            var dtTo = new Date($("#to-datepicker").datepicker("getDate"));

            if($("#to-datepicker").val()!="" && dt > dtTo) {
                $("#from-datepicker").val("");
                alert("selected date greater than 'To' date");
            }
        }
    });
    $("#to-datepicker").datepicker({
        dateFormat: "dd-M-yy",
        onClose: function (selectedDate) {
            var dt = new Date($(this).datepicker("getDate"));
            var dtFrom = new Date($("#from-datepicker").datepicker("getDate"));

            if($("#from-datepicker").val()!="" && dt<dtFrom){
                $("#to-datepicker").val("");
                alert("selected date less than 'From' date");
            }
        }
    });
});