【问题标题】:I want to validate when date and time selected is past current date and time我想验证选择的日期和时间何时超过当前日期和时间
【发布时间】:2011-12-31 21:49:44
【问题描述】:

我有两个只读文本框,一个文本框与 jquery datepicker 链接,另一个文本框与 timepicker jquery 链接。现在关于 jquery datepicker 的好处是我可以设置我的日期范围,这样用户就不能选择当前日期之前的任何日期。但是 Jquery timepicker 不能范围,所以时间在当前时间之前。

因此,用户有可能选择当前日期,但时间早于当前时间。显然,这意味着选择的时间已经过了我不希望发生的当天的当前时间。因此,如果日期文本框和时间文本框超过当前日期和时间,则需要进行验证,然后显示一条消息,说明“您选择的日期和时间在当前日期和时间之前”,否则如果时间和日期一起超过当前日期和时间然后显示“”。

我该怎么做。以下是我最好的尝试,但我无法让它工作。

<head>
            <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
            <title>Create a Session</title>
                    <script type="text/javascript">

     function validation() {
                    var dateTextO = document.getElementById("datepicker");
                    var timeTextO = document.getElementById("timepicker");
                    var errDateTimeMsgO = document.getElementById("dateTimeAlert")

    var currentDate = new Date()
        var day = currentDate.getDate()
        var month = currentDate.getMonth() + 1
        var year = currentDate.getFullYear()

        var currentTime = new Date()
        var hours = currentTime.getHours()
        var minutes = currentTime.getMinutes()
        if (minutes < 10){
        minutes = "0" + minutes
        }
        if (hours < 10){
        hours = "0" + hours
        }

        if((dateTextO < currentDate) && (timeTextO < currentTime)){
            errDateTimeMsgO.innerHTML = "The Date and Time you have selected is before the Current Date and Time";
        } else {
            errDateTimeMsgO.innerHTML = "";
        }

            }
    </script>
    </head>

    <body>
    <form action="create_session.php" method="post" name="sessionform">
    <p><strong>4: Date:</strong> <input type="text" id="datepicker" readonly="readonly"></p>
                <p><strong>5: Time:</strong> <input type="text" id="timepicker" readonly="readonly"><span class="timepicker_button_trigger"><img src="Images/clock.gif" alt="Decrease" /></span></p>
                <div id="dateTimeAlert"></div>
    </form>
    </body>

【问题讨论】:

    标签: javascript jquery validation time format


    【解决方案1】:

    其实new Date()生成的日期是这样的

    Wed Jul 20 2011 19:09:46 GMT+0530 (IST)
    

    但你的日期选择器时间可能是这样的

    28-07-2011
    

    它们有两种不同的格式。所以你不能比较,所以你必须把它们变成一种格式

    var checkindatestr = document.getElementById("datepicker");
    var dateParts = checkindatestr.split("-");
    
    var checkindate = new Date(dateParts[2], dateParts[1] - 1, dateParts[0]);
    var now = new Date();
    var difference = now - checkindate;
    

    你可以通过这种方式找到这两天的差异。

    我会想办法告诉你如何比较 2 次............ :D

    更新

        var checkindatestr = document.getElementById("datepicker"); 
        var dateParts = checkindatestr.split("-");  
        var checkindate = new Date(dateParts[2], dateParts[1] - 1, dateParts[0]); 
        var nowdate = new Date(); 
        var differenceDate = parseInt(nowdate) - parseInt(checkindate); 
    
        var checkintimestr = document.getElementById("timepicker"); 
        var timeParts = checkindatestr.split(":"); 
    
        var currentTime = new Date(); 
        var hours = currentTime.getHours();
        var minutes = currentTime.getMinutes();
    
        if(( differenceDate >= 0) && (parseInt(hours) >= parseInt(timeParts[0]))  && (parseInt(minutes) > parseInt(timeParts[1]) )){
            errDateTimeMsgO.innerHTML = "The Date and Time you have selected is before the Current Date and Time";
        } else {
            errDateTimeMsgO.innerHTML = "";
        }
    
            }
    

    【讨论】:

    • 你的时间选择器时间格式是什么,给我一个例子
    • 嗯。你知道如何获取当前的小时和分钟,所以从 document.getElementById("timepicker"); 获取值并将其拆分并与您的小时和时间部分进行比较。试试看,如果你有任何问题告诉我.........
    • 时间选择器时间示例:14:35。顺便说一句,你给我 2 天的代码,是否可以替换我目前找到当前日期的代码?
    • 还是什么都没有,我想说因为我住的英国是早上 5 点,所以我选择了以 0 开头的时间,例如01:30 或 02:15。 var hours 和 var minutes 是否以正确的格式显示?我试图得到正确的格式,这可以在我尝试更新后编辑的更新中看到
    • var differenceDate = nowdate - checkindate ; differenceDate >= 0 表示 nowadate 大于 checkindate
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-01-22
    • 2018-08-11
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多