输入won't更新javascript

input won't update javascript

本文关键字:更新 javascript won 输入      更新时间:2023-09-26

我有一个表单,我试图验证,不幸的是,字段id, edatefield,将不会在用户更正后更新。我记录了字段的值,控制台只是重复相同的默认值。

表单文件如下:

   <html>
    <head>
        <script src="http://code.jquery.com/jquery-1.11.1.js"></script>
        <style>
            #errorbox, #fielderror,
            #dateerror,#datedifferror
            {
                display:none;
            }
        </style>
    </head>
    <body>
        <?php session_start(); ?>
        <div id="errorbox">
            <p id="fielderror">Please Enter Username and Password.</p>
            <p id="dateerror">Please enter the following format for the date: mm/dd/yyyy.</p>
            <p id="datedifferror">The completion date must be greater than or equal to the start date.</p>
        </div>
        <form id="taskform" name="taskform" action="edit.php" method="POST">
            <label>Started Task:</label><p id="startdate"><?php   $startdate=new DateTime($_SESSION['startdate']); echo $startdate->format('d M Y') ?></p>
            <label>Task:</label><input type = "text" id="taskfield" name="task" value = <?php  echo $_SESSION['task']; ?> /><br />
            <label>Complete Task By:</label><input type = "text" id="edatefield" name="enddate" value ='<?php echo $_SESSION['enddate']; ?>' /><br />
            <input type="submit" onclick="checkForm()" value="Submit Edits" />
        </form>
        <script src="taskval.js"></script>
    </body>
</html>

下面是js函数的一部分:

var date1 = document.getElementById('startdate').innerHTML;
var date2 = document.getElementById('edatefield').value;

function dateDiff( date1, date2 ) {
    var startdate = date1.split(" ");
    var enddate = date2.split("/");
    var enddatemonth = enddate[1];
    var startdatemonth;
    if(enddate[2]-startdate[2]<0)
    {
        return false;
    }
    else if(enddate[2]==startdate[2]&&enddatemonth<startdatemonth)
    {
        return false;
    }
    else if(enddate[2]==startdate[2]&&enddatemonth==startdatemonth&&enddate[0]<startdate[0])
    {
        return false;   
    }
    else
    {
        return true;
    }
}
function checkDate(input){
    var dateformat=/^'d{2}'/'d{2}'/'d{4}$/;
    if (!input.value.match(dateformat))
    {
        return false;
    }
    else
    { 
        var monthfield=input.value.split("/")[0]
        var dayfield=input.value.split("/")[1]
        var yearfield=input.value.split("/")[2]
        var dayobj = new Date(yearfield, monthfield-1, dayfield)
        if ((dayobj.getMonth()+1!=monthfield)||(dayobj.getDate()!=dayfield)||(dayobj.getFullYear()!=yearfield))
        {
            return false;
        }
        else
        {
            return true;
        }
    }
}

很抱歉这么长,但我不确定是什么导致了这里的问题,所以我只是把我认为可能是必要的。

在页面加载时缓存元素的值。当脚本加载时,方法之外的所有内容都会立即执行,这就是为什么当页面加载时,您总是得到它是什么。

你应该使用:

缓存元素
var datefield = document.getElementById('edatefield');

,然后在你的方法中获取值:

var userValue = datefield.value;

或移动文档。getElementById在方法内部,所以它总是获取当前值。