Question

我有两个输入框，startDate和tilldate。我正在使用jQuery datepicker。问题是，当用户选择startDate然后在tillDate中，只有两天应该启用选择。例如01/04/2015，tilldate可以是相同的日期或下一个日期，02/04/2015。

<td><input type="text" id="startDate" name="startDate"  ></td>
<td><input type="text" id="tillDate" name="tillDate"></td>

$(function () {
    var setDate;
    $("#startDate")
    .datepicker({
        showOn: "button",
        buttonImage: 'http://jqueryui.com/resources/demos/datepicker/images/calendar.gif',
        buttonImageOnly: true,
        buttonText: "Select Date",
        changeMonth: true,
        changeYear: true,
        maxDate: '0',
        onSelect: function (selected) {
            $("#tillDate").datepicker("option", "minDate", selected)
            setDate = $("#startDate").val();
            alert(setDate);
        }
    });    

    $("#tillDate").datepicker({
        showOn: "button",
        buttonImage: 'http://jqueryui.com/resources/demos/datepicker/images/calendar.gif',
        buttonImageOnly: true,
        buttonText: "Select Date",
        changeMonth: true,
        changeYear: true,
        maxDate: setDate + "2D",
        onSelect: function (selected) {
            $("#startDate").datepicker("option", "maxDate", selected)
        }
    });

    $(".ui-datepicker-trigger").mouseover(function () {
        $(this).css('cursor', 'pointer');
    });
});

Answer 1

好的，如果我做对了，你只是不希望用户在开始日期值之前选择一个日期？

如果是这样，为什么不将开始日期值放在全局中，然后在你的untildate函数中检索它。获得该值后，您只需检查untildate值是否不是开始日期之前的日期，如果是，请清除输入。

但是你可能还需要验证开始日期。

Answer 2

根据我的理解，您只需要两天才能完成。请检查以下代码

 <script type="text/javascript">
       $(function () {
     var setDate;

    $("#startDate")
    .datepicker(
         {
        showOn: "button",
        buttonImage: 'http://jqueryui.com/resources/demos/datepicker/images/calendar.gif',
        buttonImageOnly: true,
        buttonText: "Select Date",
        changeMonth: true,
        changeYear: true,
        maxDate:'0' ,
       onSelect: function (selected) {
             setDate = $("#startDate").val();
             var maxDatevale=new Date(setDate);
             maxDatevale.setDate(maxDatevale.getDate()+1);
             alert(maxDatevale);
            $("#tillDate").datepicker("option", "minDate", setDate)
             $("#tillDate").datepicker("option", "maxDate", maxDatevale)


        }
    });    

    $("#tillDate").datepicker({
        showOn: "button",
        buttonImage: 'http://jqueryui.com/resources/demos/datepicker/images/calendar.gif',
        buttonImageOnly: true,
        buttonText: "Select Date",
        changeMonth: true,
        changeYear: true,
        maxDate: setDate + "2D",
        onSelect: function (selected) {
            $("#startDate").datepicker("option", "maxDate", selected)
        }
    });

    $(".ui-datepicker-trigger").mouseover(function () {
        $(this).css('cursor', 'pointer');
    });
});
    </script>

如何验证jquery datePicker日期？

2 个答案: