Jquery datepicker in mindate and maxdate

本文关键字：and maxdate mindate in datepicker Jquery 更新时间：2023-09-26

我有这个日期时间选择器从jquery。这是我的代码。只添加了一些月份和年份的代码后，它就不起作用了。

问题是在选择了第二个输入之后。第一个输入消失了…然后也。* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *

$(function() {
    $( "#dtp1" ).datepicker({
        changeMonth: true,
        changeYear: true,
        showButtonPanel: true,
        dateFormat: 'MM yy',
        onClose: function( selectedDate, dateText, inst ) {
            $( "#dtp2" ).datepicker( "option", "minDate", selectedDate );
        var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
        var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
        $(this).datepicker('setDate', new Date(year, month, 1));
        }
    });
});
$(function() {
    $( "#dtp2" ).datepicker({
        changeMonth: true,
        changeYear: true,
        showButtonPanel: true,
        dateFormat: 'MM yy',
        onClose: function( selectedDate, dateText, inst  ) {
            var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
        var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
        $(this).datepicker('setDate', new Date(year, month, 1));
            $( "#dtp1" ).datepicker( "option", "maxDate", selectedDate );
        }
    });
});

这里是链接http://jsfiddle.net/wind_chime18/RUmCg/2/

我已经完成了第2个日期选择器的验证，您可以将其复制为第1个日期选择器。检查链接Js提琴链接

//Php代码

<input type="text" id="dtp1">
<input type="text" id="dtp2">
 <!--<input type="text" id="dtp2" disabled>-->

//Javascript代码

$(function () {
    $("#dtp1").datepicker({
        changeMonth: true,
        changeYear: true,
        showButtonPanel: true,
        dateFormat: 'mm/yy',
        onClose: function (selectedDate, dateText, inst) {
             //$( "#dtp2" ).datepicker( "option", "minDate", selectedDate );
            var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
            var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
            $(this).datepicker('setDate', new Date(year, month, 1));
            //$("#dtp2").removeAttr('disabled');
        }
    });
});
$(function () {
    $("#dtp2").datepicker({
        changeMonth: true,
        changeYear: true,
        showButtonPanel: true,
        dateFormat: 'mm/yy',
        onClose: function (selectedDate, dateText, inst) {
            if($("#dtp1").val() == "") {
                alert("Please select dpt1");
                return false;
            }
            else {
             var dtp1 = $("#dtp1").val();
            var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
            var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
            var d1, d2;
                d2 = (year *1 ) + ((month  *1)/ 12);
                d1 = (dtp1.split('/')[1] *1 ) + ((dtp1.split('/')[0] *1)/ 12);
                if(d1 > d2) {
                    alert("dpt1 is greater then dpt2");
                    return false;
                }
                else {
                 $(this).datepicker('setDate', new Date(year, month, 1));
                }
            }
        }
    });
});