Fatal编程技术网
  • javascript/
  • Javascript 为什么表格仍然提交？

Javascript 为什么表格仍然提交？

javascript validation

Javascript 为什么表格仍然提交？,javascript,validation,Javascript,Validation,我想知道为什么表单仍然提交，而没有显示验证结果。我也尝试过在输入类型行中使用onclick事件，但也没有乐趣：-( 这是表格 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang=

我想知道为什么表单仍然提交，而没有显示验证结果。我也尝试过在输入类型行中使用onclick事件，但也没有乐趣：-(

这是表格

<!DOCTYPE html PUBLIC
  "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-type" content="text/html; charset=iso-8859-1"/>
<title>Submit a runner time</title>
</head>
<body>
<script src="TMA02validationSubmitResultForm.js"></script> 
<hr/>
<h1>Submit a runner time</h1>
<hr/>
Note: all fields marked '*' are mandatory.
<p/>
<form action="http://jdm423.tt284.open.ac.uk/uploadblock2/storedata.php" method="post" onsubmit="return validateForm()" id="submitrunnertime" name="submitrunnertime">
<table>
<div id="error"> </div>
<tr><td>Runner ID*</td>
<td><input type="text" onblur="validateRunnerId()" id="RunnerId" name="RunnerId"  size="5" maxlength="5"/></td>
</tr>
<tr><td>Event ID*</td>
<td><input type="text" onblur="validateEventId()" name="EventId" id="EventId" size="5" maxlength="5"/></td>
</tr>
<tr><td>Date (YYYY-MM-DD)*</td>
<td><input type="text" onblur="validateDate()" name="Date" id="When" size="10" maxlength="10"/></td>
</tr>
<tr><td>Finish time (HH:MM:SS)*</td>
<td><input type="text" onblur="validateTime()" name="FinishTime" id="Time" size="8" maxlength="8"/></td>
</tr>
<tr><td>Position*</td>
<td><input type="text" onblur="validatePosition()" name="Position" id="Position" size="5" maxlength="5"/></td>
</tr>
<tr><td>Category ID*</td>
<td><input type="text" onblur="validateCategoryId()"name="CategoryId"  id="CategoryId" size="2" maxlength="3"/></td>
</tr>
<tr><td>Age grade*</td>
<td><input type="text" onblur="validateAge()" name="AgeGrade"  id="Age" size="5" maxlength="5"/></td>
</tr>
<tr><td>Personal best</td>
<td><input type="text" onblur="validatePB()" name="PB"  id="PB" size="1" maxlength="1"/></td>
</tr>
</table>
<input type="submit" name="submitrunnertime"  id="submitrunnertime" value="submit"/>
<hr/>
</form>
</body>
</html>
非常感谢您花时间帮助这位新手：）

在此代码中：

function validateForm() {
    return (validateRunnerId
        && validateEventId
        && validateDate
        && validateTime
        && validatePosition
        && validateCategoryId
        && validateAge
        && validatePB);
}
…你不是在调用你的函数，你只是在引用它们。因为函数引用是真实的，所以条件总是真实的，形式总是有效的

要调用函数，请在函数后面加上
（）
。假设你的函数不需要参数，那就是：

function validateForm() {
    return (validateRunnerId()
        && validateEventId()
        && validateDate()
        && validateTime()
        && validatePosition()
        && validateCategoryId()
        && validateAge()
        && validatePB());
}
但是很难说，因为很多函数都声明了参数，但也声明了与变量相同的符号，说得委婉些，这很奇怪。

这些函数看起来很奇怪。例如，
validateRunnerId
声明它接受一个
ID
参数，但在下一行中声明一个
ID
变量并设置其值。因此，
ID
参数，即使在调用函数时给出，也永远不会被使用。最好删除函数validateRunnerId上的ID参数吗？@Joy：如果您没有使用该参数（在这种情况下，您没有），是的。请注意，其他一些人也做了类似的事情。你是一个明星，非常感谢！这是我第一次…@JoyAdamson:我不明白你的问题。当函数发现问题时（只需看一眼），它们似乎会返回false，因为您在上面使用了
&&
，如果任何函数返回false，表达式将是
false
（并且不会调用后续函数，因为引擎在知道结果后立即停止计算表达式）。 
function validateForm() {
    return (validateRunnerId()
        && validateEventId()
        && validateDate()
        && validateTime()
        && validatePosition()
        && validateCategoryId()
        && validateAge()
        && validatePB());
}