当前位置: 首页 > 知识库问答 >
问题:

Jquery datepicker根据第一个日期字段中选定的日期限制第二个日期字段中的日期

支华池
2023-03-14

我使用Jquery日期选择器,我有以下代码,当用户选择日期时,下面的字段填充日期1

$('#dt2').datepicker({
        dateFormat: "dd-M-yy" 
    });

$("#dt1").datepicker(
    {dateFormat: "dd-M-yy", 
    minDate:  0,
onSelect: function(date){
var date2 = $('#dt1').datepicker('getDate');
            date2.setDate(date2.getDate()+1);
            $('#dt2').datepicker('setDate', date2);

我想限制dt2字段中的日期,该字段不应低于dt1字段中的日期。E、 g.如果在dt1中选择的日期为2013年5月1日,则允许用户在2013年5月1日之后选择日期,但不得小于2013年5月2日

如何在日期字段2中限制日期领料?

共有3个答案

谷梁波
2023-03-14

我刚刚更改了您的代码,以便自动设置date2的最小日期

  $("#dt1").datepicker({
            dateFormat: "dd/mm/yy",
            onSelect: function (date) {
                var dt1 = $('#dt1').datepicker('getDate');
                var dt2 = $('#dt2').datepicker('getDate');
                if (dt1 > dt2) {
                    $('#dt2').datepicker('setDate', dt1);
                }
                $('#dt2').datepicker('option', 'minDate', dt1);
            }
        });
        $('#dt2').datepicker({
            dateFormat: "dd/mm/yy",
            minDate: $('#dt1').datepicker('getDate'),
            onClose: function () {
                var dt1 = $('#dt1').datepicker('getDate');
                var dt2 = $('#dt2').datepicker('getDate');
                //check to prevent a user from entering a date below date of dt1
                if (dt2 <= dt1) {
                    var minDate = $('#dt2').datepicker('option', 'minDate');
                    $('#dt2').datepicker('setDate', minDate);
                }
            }
        });
通奕
2023-03-14

我是这样做的--

演示

代码如下

$('#dt2').datepicker({
    dateFormat: "dd-M-yy" 
});

$("#dt1").datepicker({
    dateFormat: "dd-M-yy", 
    minDate:  0,
    onSelect: function(date){            
        var date1 = $('#dt1').datepicker('getDate');           
        var date = new Date( Date.parse( date1 ) ); 
        date.setDate( date.getDate() + 1 );        
        var newDate = date.toDateString(); 
        newDate = new Date( Date.parse( newDate ) );                      
        $('#dt2').datepicker("option","minDate",newDate);            
    }
});
奚卓
2023-03-14

我为你创建了一个jsfiddle。我不能100%确定它是否“万无一失”,但为了防止用户手动输入日期,您可以将输入设置为readonly例如。

<input type="text" id="dt1" readonly="readonly">

此时,我会再次检查dt2,如果其日期低于dt1s日期,我会更正它。此外,如果在dt1中选择了日期,则dt2的minDate设置为dt1 date 1。

$(document).ready(function () {

    $("#dt1").datepicker({
        dateFormat: "dd-M-yy",
        minDate: 0,
        onSelect: function (date) {
            var date2 = $('#dt1').datepicker('getDate');
            date2.setDate(date2.getDate() + 1);
            $('#dt2').datepicker('setDate', date2);
            //sets minDate to dt1 date + 1
            $('#dt2').datepicker('option', 'minDate', date2);
        }
    });
    $('#dt2').datepicker({
        dateFormat: "dd-M-yy",
        onClose: function () {
            var dt1 = $('#dt1').datepicker('getDate');
            var dt2 = $('#dt2').datepicker('getDate');
            //check to prevent a user from entering a date below date of dt1
            if (dt2 <= dt1) {
                var minDate = $('#dt2').datepicker('option', 'minDate');
                $('#dt2').datepicker('setDate', minDate);
            }
        }
    });
});

看到jsfiddle

 类似资料:
  • 问题内容: 我正在使用Jquery日期选择器,并且我有以下代码,其中当用户选择日期时,下面的字段填充为日期+1 我想限制字段中的日期,该日期不应低于字段中的日期。例如,如果在中选择的日期为,则允许用户选择,日期不得少于, 如何限制日期字段2中的日期选择? 问题答案: 我为您创建了一个jsfiddle。我不是100%肯定,如果它是“万无一失”,但以防止用户手动输入一个日期,你可以设置输入如 目前,我

  • Jquery datepicker根据第一个日期字段中选定的日期限制第二个日期字段中的日期,反之亦然(根据第二个日期字段中选定的日期限制第一个日期字段中的日期) 我有2个文本框FromDate和Todate它取决于用户将首先选择哪个字段,他有2个选项FromDate和Todate。 如果用户1选择fromdate ex(2017年6月15日),则在“Todate”字段中,将阻止在“fromdate

  • 我有一个java实体类TimeEntry.java它的属性之一是Date,它看起来像这样。 对于该字段,在swagger UI模型模式上,字段日期显示为“日期”:“2016-01-08T22:34:22.337Z”,但我需要该字段作为“日期”:“2016-01-08”。 我尝试了以下方法: 请帮帮忙。

  • 为了实现这一点,我使用碳通过模型突变体转换日期。这意味着,首先我有日期: 我的变种人有以下几种: 现在,除了一个领域:“policy_cancellation”,一切都很好 当从表单向数据库插入数据时,如果policy_cancellation为空,则提交成功,但如果有数据,则PDO返回错误,例如: 触发以下命令: 另一个奇怪的情况(至少对我来说)是,在policy_cancellation突变体

  • 问题内容: 给定一个特定的日期(例如2011-07-02),我如何找到该日期之后的下一个星期一(或该日的任何工作日)的日期? 问题答案:

  • 问题内容: 在我的收藏夹中,每个文档都有2个修改和同步的日期。我想查找已修改>同步,或不存在同步的内容。 我试过了 但没有显示我的期望。有任何想法吗? 谢谢 问题答案: 您不能将一个字段与具有正常查询匹配的另一个字段的值进行比较。但是,您可以使用聚合框架执行此操作: 我在其中输入“您的其他常规查询”,因为您可以使该位使用索引。因此,如果您只想对该字段所在的文档执行此操作,则可以执行以下操作: 用输