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

标签 javascript jquery date jquery-ui datepicker

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

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

最佳答案

请使用以下代码。

$( 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

关于javascript - Jquery 日期选择器。 2 个日期选择器。限制范围。默认日期 当前日期,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42900652/

相关文章:

javascript - blueimp 文件 uploader 直接上传到 AWS S3 替换之前的部分

jquery 数据属性随机工作

java - 将日期字符串与时区进行比较

javascript - SHA1 计算返回错误值

javascript - 如何从html或javascript等网页打开putty

javascript - 如何在具有特定类的 <a> 的 <p> 上使用 .remove ?

java - java.util.Date 中的默认时区是什么

ajax - 通过 ajax 的 grails datepicker 值

javascript - 在 Angular js过滤器中格式化时间

javascript - 如何通过点击收到的链接来实现电子邮件验证?