jqueryui datepicker,比较两个日期并调整大于或小于

标签 jquery jquery-ui datepicker

我正在尝试创建两个输入 sdateedate 的 dateRange,但如果 sdate 大于 edate,我希望将 edate 设置为 sdate选择为,反之亦然。

一个例子是:

如果 sdate 和 edate 都设置为“2014-08-02”,如果我 edate 为“2014-08-01”,则 sdate 应移至“2014-08-01”。但是,将 edate 设置为“2014-08-03”除了更改 edate 之外什么也不做。

如果 sdate 大于 edate,应该以类似的方式工作。

编辑:更新了 jsfiddle 并进行了改进。当我用 sdate 传递它时,我可以改变 edate,但是如果它小于 sdate,我就无法改变 edate。 Here's a jsfiddle.

function dateRange() {
     $(function () {
     $("#sdate").datepicker({ dateFormat: "yy-mm-dd",
        defaultDate: "+0d",
        changeMonth: true,
        changeYear: true,
        onClose: function () {
            testDates();
        }
    });
    $("#sdate").datepicker("setDate", "set");
    $("#edate").datepicker({ dateFormat: "yy-mm-dd",
        defaultDate: "+0d",
        changeMonth: true,
        changeYear: true,
        onClose: function () {
            testDates();
        }
    });
    $("#edate").datepicker("setDate", "set");
});
function testDates() {
    var sdate = $("#sdate").datepicker("getDate");
    var edate = $("#edate").datepicker("getDate");
    if (sdate > edate) {
        $("#sdate").datepicker("setDate", sdate);
        $("#edate").datepicker("setDate", sdate);
    }else if (edate < sdate) {
        $("#sdate").datepicker("setDate", edate);
        $("#edate").datepicker("setDate", edate);
     }
}
}

最佳答案

我能够通过在函数中构建条件来解决这个问题。

function dateRange() {
    $(function () {
        $("#sdate,#edate").datepicker({
            dateFormat: "yy-mm-dd",
            defaultDate: "+0d",
            changeMonth: true,
            changeYear: true
        }).change(function () {
            var sdate = $('#sdate').datepicker("getDate");
            var edate = $('#edate').datepicker("getDate");
            if (this.id == 'sdate') {
                if (sdate > edate) {
                    $('#edate').datepicker("setDate", sdate);
                }
            } else {
                if (edate < sdate) {
                    $('#sdate').datepicker("setDate", edate);
                }
            }
        });
        $("#sdate,#edate").datepicker("setDate", "set");
    });
}

jsfiddle:http://jsfiddle.net/tmac25/udtmn6n7/

关于jqueryui datepicker,比较两个日期并调整大于或小于,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25214569/

相关文章:

javascript - _.template lodash 中的 onClick

javascript - 如何使用 javascript 检测内联链接?

javascript - 在浏览器上保存数据(作为 JS 数组)是一件坏事吗?

jquery - 日期选择器将空值传递给 Controller

jquery mobile pageshow事件想要为特定页面工作

Javascript 全局变量在 jQuery Droppable 中不起作用

jquery - 为什么我的 jQuery 日期选择器 UI 插件不在年份字段中显示向上/向下箭头

jquery - 使用 jQuery UI 的可拖动按钮

css - 如何在对话框 vuetify 中设置布局行?

javascript - 日期范围选择器如何在输入日期时触发事件