[英]Trouble with form validation
我正在尝试使用JavaScript验证简单表单,但是无法验证脚本。 按下“提交”按钮时,不会运行任何验证。 如果其中一个框为空,则不会弹出错误消息来通知用户。 但是,我没有看到任何异常。 我想知道提交按钮是否不起作用? 谁能伸出援手?
<DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>LASTNAME: Warner Form Validation</title>
<script type="text/javascript">
function btnSubmit_onclick() {
var myForm = document.formContact;
if(myForm.txtAge.value == "" || myForm.txtName.value == "") {
alert.("Please complete all of the fields.");
if(myForm.txtName.vale == ""){
myForm.txtName.focus();
} else {
myForm.txtAge.focus();
} else{
alert("Thank you for completing the form"+myForm.txtName.value);
}
}
function txtAge_onblur() {
var txtAge = document.formContact.txtAge;
if(isNaN(txtAge.value) == true) {
alert("Please Enter a Valid Age");
txtAge.select();
}
function txtName_onchange(); {
window.status = "Hi" + document.form1.txtName.value;
docment.getElementById('greeting').innerHTML = "Hi" + document.frm1.txtName.value;
}
</script>
</head>
<body>
<form action="" id="formContact" method="post" onsubmit="return validate();" name="formContact">
<p>Name:<br />
<input type="text" name="theName"><span class="err" id="nameErr"></span>
</p>
<p>Age:<br />
<input type="text" name="theAge"><span class="err" id="ageErr"></span>
</p>
<p>
<p>How may we contact you?<br>
<input type="radio" name="contact" value="email">Email<br>
<input type="radio" name="contact" value="no contact">No Contact<br>
</p>
<p><input type="button" value="Submit" name="btnSubmit" onclick="btnSubmit_onclick></p>
</form>
<span id="results"></span>
</body>
</html>
您的代码有很多错别字。 这可行。
<DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>LASTNAME: Warner Form Validation</title>
<script type="text/javascript">
function btnSubmit_onclick() {
var myForm = document.formContact;
if(myForm.txtAge.value == "" || myForm.txtName.value == "") {
alert("Please complete all of the fields.");
if(myForm.txtName.vale == ""){
myForm.txtName.focus();
} else {
myForm.txtAge.focus();
}
} else{
alert("Thank you for completing the form"+myForm.txtName.value);
}
}
function txtAge_onblur() {
var txtAge = document.formContact.txtAge;
if(isNaN(txtAge.value) == true) {
alert("Please Enter a Valid Age");
txtAge.select();
}
function txtName_onchange() {
window.status = "Hi" + document.form1.txtName.value;
docment.getElementById('greeting').innerHTML = "Hi" + document.frm1.txtName.value;
}
}
</script>
</head>
<body>
<form action="" id="formContact" method="post" onsubmit="return validate();" name="formContact">
<p>Name:<br />
<input type="text" name="txtName"><span class="err" id="nameErr"></span>
</p>
<p>Age:<br />
<input type="text" name="txtAge"><span class="err" id="ageErr"></span>
</p>
<p>
<p>How may we contact you?<br>
<input type="radio" name="contact" value="email">Email<br>
<input type="radio" name="contact" value="no contact">No Contact<br>
</p>
<p><input type="button" value="Submit" name="btnSubmit" onclick="btnSubmit_onclick()"></p>
</form>
<span id="results"></span>
</body>
</html>
但是请注意,您尚未在任何地方使用txtAge_onBlur或txtName_onChange函数。 我也建议对年龄字段添加数字检查。
您有onsubmit="return validate();"
但是我在脚本的任何地方都看不到validate()
。
然后在脚本中有btnSubmit_onclck()
,而在HTML中有onclick="btnSubmit_onclick
。
因此它缺少一个i
而在HTML中,您缺少了结尾"
。
您还需要检查txtAge_onblur
和btnSubmit_onclick
上缺少的结束}
onclick="btnSubmit_onclick></p>
至
onclick="btnSubmit_onclick();"></p>
和
function btnSubmit_onclck() {
至
function btnSubmit_onclick() {
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.