如何防止选择中间有禁用日期的日期范围？

Question

我有两个 Jquery 日期选择器，可以在其中选择日期范围。

我已经实施了某些限制，例如，textbox2 的日期应始终大于 textbox1。此外，我已禁用某些日期。

我需要的是，如果用户从日期中选择，然后选择到日期，如果两者之间存在禁用日期，则用户应该无法选择该范围。

例如：

我已禁用日期： "31-5-2014", "1-6-2014", "2-6-2014"

如果用户选择 date1 作为29-5-2014，并尝试选择4-6-2014作为第二个日期，那么他应该无法这样做，因为禁用日期在 betweeb 中。date2 的最大值必须是30-5-2014

添加小提琴

Answer 1

我在您的代码中添加了一个函数“validateDateRange”，以说明完成此任务所需的逻辑。请注意，我添加的功能的目的是在您描述的情况发生时简单地弹出警报。从这里你应该可以做任何你喜欢的事情。如果您有更多问题或正在寻找其他内容，请告诉我们。

这是我的更新

function validateDateRange() {

    var txtStartDate = $("#start_date");
    var txtEndDate = $("#end_date");
    var startDate;
    var endDate;
    var tempDate;

    if (txtStartDate.val() == "") 
        return false;

    if (txtEndDate.val() == "") 
        return false;

    startDate = new Date(txtStartDate.val());
    endDate = new Date(txtEndDate.val());

    for (i = 0; i < unavailableDates.length; i++) {
        var temp = unavailableDates[i].split("-");

        tempDate = new Date(temp[2], temp[1]-1, temp[0]);

        if (startDate < tempDate && endDate > tempDate) {
            alert("Invalid Date Range");
            return false;
        }
    }
}