EasyUI datebox 日期范围 日期关联

jQuery EasyUI 1.4.5   

 

   html:

<label>提交日期：</label>
<input id="startDate" name="name" class="easyui-datebox textbox-f" data-options=""/>
-
<input id="endDate" name="name" class="easyui-datebox textbox-f" data-options=""/>

 

js:

$(function () {

    $('#startDate').datebox({
        onSelect: function (select) {

            var endDate = $('#endDate').datebox('getValue');
            if (!endDate) {
                $('#endDate').datebox().datebox('calendar').calendar({
                    validator: function (date) {
                        // var startDate = $('#startDate').datebox('getValue');
                        var startDate = select;
                        if (!startDate) {
                            return date;
                        }
                        var d1 = new Date(startDate);
                        var d2 = new Date(startDate);
                        d2.setDate(d2.getDate() + 7);// 范围 到开始日期之后的7天
                        return d1 <= date && date <= d2;
                    }
                });
            }
        }
    });

    $('#endDate').datebox({
        onSelect: function (select) {

            var startDate = $('#startDate').datebox('getValue');
            if (!startDate) {
                $('#startDate').datebox().datebox('calendar').calendar({
                    validator: function (date) {
                        // var endDate = $('#endDate').datebox('getValue');
                        var endDate = select;
                        if (!endDate) {
                            return date;
                        }
                        var d1 = new Date(endDate);
                        var d2 = new Date(endDate);
                        d1.setDate(d1.getDate() - 7);//范围 到结束日期前的前7天
                        return d1 <= date && date <= d2;
                    }
                });
            }
        }
    });

});

 

转载于:https://www.cnblogs.com/fanlinglong/p/6549271.html