日期选取器日期范围:最大日期的最小日期 = 开始日期 + 1 天

datepicker date range: max date's min date = start day + 1 day

本文关键字：日期 开始 选取 范围      更新时间：2023-09-26

使用 jQuery UI 的日期选择器日期范围，如何自定义默认功能，以便在选择开始日期时，结束日期的最小日期与开始日期不同，而是开始日 + 1 天。

我知道我可以用一堆getDate()和setDate()函数替换"selectedDate"，val()开始日期调用，但我想知道日期选择器是否可能支持预期功能。像selectedDate +1 day这样的东西，但显然我已经尝试过了，这不起作用。

波纹管是我当前使用的代码，它将#to的minDate选项设置为#from中的选定日期 

<input type="text" id="from" name="from">
<input type="text" id="to" name="to">
<script>
    $(function() {
        $( "#from" ).datepicker({
            onClose: function( selectedDate ) {
                $( "#to" ).datepicker( "option", "minDate", selectedDate ); 
                //how to change this so that the minDate is selectedDate + 1 day? 
            }
        });
        $( "#to" ).datepicker({
            onClose: function( selectedDate ) {
                $( "#from" ).datepicker( "option", "maxDate", selectedDate );
            }
        });
    });
</script>

你可以使用这个

var actualDate = new Date(selectedDate);
var newDate = new Date(actualDate.getFullYear(), actualDate.getMonth(), actualDate.getDate()+1);


$(function() {
        $( "#from" ).datepicker({
            onClose: function( selectedDate ) {
                //$( "#to" ).datepicker( "option", "minDate", selectedDate ); 
                //how to change this so that the minDate is selectedDate + 1 day? 
            var actualDate = new Date(selectedDate);
            var newDate = new Date(actualDate.getFullYear(), actualDate.getMonth(), actualDate.getDate()+1);
       
            $("#to").datepicker("option","minDate", newDate)
            },
          
        });
        $( "#to" ).datepicker({
            onClose: function( selectedDate ) {
                $( "#from" ).datepicker( "option", "maxDate", selectedDate );
            }
        });
    });
<link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.1/jquery-ui.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.1/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.1/jquery-ui.js"></script>
<input type="text" id="from" name="from">
<input type="text" id="to" name="to">

相关文章：