jQuery 日期选择器。 2个日期选择器。限制范围。默认日期 当前日期

Posted

技术标签:

【中文标题】jQuery 日期选择器。 2个日期选择器。限制范围。默认日期 当前日期【英文标题】:Jquery datepicker. 2 datepickers. Restrict range. Default date current date 【发布时间】:2017-08-11 13:22:13 【问题描述】:

我正在使用带有两个输入框的 jQuery Datepicker 小部件,一个用于“From”日期,第二个用于“To”日期。我正在使用 jQuery Datepicker,但我需要这些额外的限制:

    默认情况下,“开始”日期和“结束”日期都必须在日历中突出显示当前日期。 如果先选择“To”日期,则“From”日期只能在“To”日期之前的 31 天范围内。如果先选择“开始”日期,则“结束”日期只能在“开始”日期之后的 31 天范围内。无论哪种情况,都应禁用其余日期。 我需要 dd-mm-yyyy 格式的日期。

【问题讨论】:

如果没有指定默认日期,则第一点应该是默认行为。你都尝试了些什么?显示你的代码以及你卡在哪里 我在此链接上尝试了最佳答案代码:***.com/questions/330737/… 但在此所有当前日期后的日期都被禁用,并且还有一些最小日期......我没有任何这些限制. 【参考方案1】:

请使用以下代码。

$( function() 
    $("#fromDate").datepicker(
          dateFormat: 'yy-mm-dd',
        inline: true,
        onSelect: function(date, inst) 
                 var selDate = new Date(date);
                 var newDate = new Date(selDate.getFullYear(), selDate.getMonth(), selDate.getDate()+31);
                  $('#toDate').datepicker('option', 'minDate', selDate );
                  $('#toDate').datepicker('option', 'maxDate', newDate );
        
        );
        $("#fromDate").datepicker('setDate', new Date());

    $( "#toDate" ).datepicker(
            dateFormat: 'yy-mm-dd',
            inline: true,
            onSelect: function(date, inst) 
                 var selDate = new Date(date);
                 var newDate = new Date(selDate.getFullYear(), selDate.getMonth(), selDate.getDate()-31);
                  $('#fromDate').datepicker('option', 'minDate', newDate );
                  $('#fromDate').datepicker('option', 'maxDate', selDate );
            
    );
    $("#toDate").datepicker('setDate', new Date());
   );

参考Fiddle

【讨论】:

另外,我需要 dd-mm-yy 格式。我更改了 dateFormat 和新 Date() 中的序列。但它不起作用。

以上是关于jQuery 日期选择器。 2个日期选择器。限制范围。默认日期 当前日期的主要内容,如果未能解决你的问题,请参考以下文章

Jquery 日期选择器限制日期,例如 2222222/33333/444444

小程序表单中日期选择器可以限制日期吗?

jQuery 日期选择器验证问题

JQuery UI日期选择器结束日期开始日期后1天

如何在 jQuery 日期选择器中为禁用日期添加工具提示?

jQuery 多日期选择器问题