【问题标题】:Disable end date not more than 10 day calendar javascript禁用结束日期不超过 10 天的日历 javascript
【发布时间】:2019-05-21 16:48:03
【问题描述】:

我想知道禁用结束日期不超过 10 天。此值选择开始日期动态

示例: 选择开始日期 2018 年 12 月 21 日 选择结束日期(选择超过 10 天的日期)2018 年 12 月 30 日

startdate 动态到 enddate 10 天此外禁用所有日历长度 1-10 天 / min1 - max10

<script>
    $("#dateFrom").datepicker({
        "onSelect": function () {
            var input = $(this);
            var dayAfter = input.datepicker("getDate");
            dayAfter.setDate(dayAfter.getDate() + +10);
            $("#dateTo").datepicker("option", "minDate", dayAfter);
            $("#dateTo").datepicker("refresh");
        }
    });
    $("#dateTo").datepicker({
        "onSelect": function () {
            var input = $(this);
            $("#dateFrom").datepicker("option", "maxDate", input.datepicker("getDate"));
            $("#dateFrom").datepicker("refresh");
        }
    });
</script>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
  <link rel="stylesheet" href="/resources/demos/style.css">
  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<div> <span>startdate :</span>

    <input type="text" class="datepicker-to" id="dateFrom" name="dateFrom" />
</div>
<div> <span>enddate :</span>

    <input type="text" class="datepicker-to" id="dateTo" name="dateTo" />
</div>

【问题讨论】:

    标签: javascript jquery jquery-ui datepicker


    【解决方案1】:

    如果我没记错的话,你希望 startDate 和 endDate 在 10 天内。你可以试试这个:

      `$("#dateFrom").datepicker({
      "onSelect": function() {
        var input = $(this);
        var dayAfter = input.datepicker("getDate");
        dayAfter.setDate(dayAfter.getDate() + 10);
        $("#dateTo").datepicker("option", "minDate", input.datepicker("getDate"));
        $("#dateTo").datepicker("option", "maxDate", dayAfter);
        $("#dateTo").datepicker("refresh");
      }
    });
    $("#dateTo").datepicker({
      "onSelect": function() {
        /*     var input = $(this);
            $("#dateFrom").datepicker("option", "maxDate", input.datepicker("getDate"));
            $("#dateFrom").datepicker("refresh"); */
      }
    });`
    

    我有测试;没关系;看看我的 jsfiddle:enter link description here

    【讨论】:

    • 一个问题。请示例输入 type="date" 不要使用 datepicker
    • @Tanaphon Prayoonprasop 你可以试试,使用 input type="date" props 'min' 和 'max'
    【解决方案2】:

    您正在使用 jQuery Datepicker?这有一个选项。

    // Getter
    var maxDate = $( ".selector" ).datepicker( "option", "maxDate" );
    
    // Setter
    $( ".selector" ).datepicker( "option", "maxDate", "+1m +1w" );
    

    链接到documentation

    【讨论】:

    • no not working enddate reference this value startdate
    • 您想让用户选择开始日期是否正确。然后当他们打开#dateTo 时,他们会得到一个从选定日期到选定日期 + 10 天的可选范围?
    猜你喜欢
    • 2015-02-09
    • 2019-10-20
    • 2018-09-18
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多