問題は、送信ボタンをクリックしても、メッセージが表示された後に、検証エラーを表示するためにコードが正常に動作することです。つまり、エラーメッセージは表示されたままです)、エラーメッセージがあっても成功ページにリダイレクトされます。Javascriptフォーム検証送信ボタンの問題
は、コードを見てください:検証エラーがあるたびに
var flag = 0;
function username() {
usrn = document.form1.txt.value;
if (usrn == "") {
document.getElementById("user").innerHTML = "Please enter a username";
flag = 1;
} else if (usrn.length < 8) {
document.getElementById("user").innerHTML = "minimum 8 characters required";
flag = 1;
}
}
function password() {
pass = document.form1.pass.value;
cpass = document.form1.cpass.value;
if (pass == "") {
document.getElementById("password").innerHTML = "Please enter a password";
flag = 1;
} else if (pass.length < 8) {
document.getElementById("password").innerHTML = "minimum 8 characters required";
flag = 1;
} else if (cpass == "") {
document.getElementById("cpassword").innerHTML = "Please confirm password";
flag = 1;
} else if (cpass != pass) {
document.getElementById("cpassword").innerHTML = "passwords do not match";
flag = 1;
} else
return;
}
function cpassword() {
cpass = document.form1.cpass.value;
pass = document.form1.pass.value;
if (cpass == "") {
document.getElementById("cpassword").innerHTML = "Please confirm password";
flag = 1;
} else if (cpass != pass) {
document.getElementById("cpassword").innerHTML = "passwords do not match";
flag = 1;
} else
return;
}
function email() {
email = document.form1.em.value;
if (email == "") {
document.getElementById("emailid").innerHTML = "Please enter Email-ID";
flag = 1;
}
}
function check(form) {
flag = 0;
username();
password();
email();
if (flag == 1) {
return false;
} else {
return true;
}
}
<form name="form1" action="success.html" onSubmit="return check(this)" method="post">
<table cellpadding="10">
<tr>
<caption>FILL FORM</caption>
</tr>
<tr>
<td>
<label for="txt">Enter Username</label>
</td>
<td>
<input type="text" id="txt">
<div class="error" id="user" onBlur="username()"></div>
</td>
</tr>
<tr>
<td>
<label for="pass">Enter Password</label>
</td>
<td>
<input type="password" id="pass" onBlur="password()">
<div class="error" id="password"></div>
</td>
</tr>
<tr>
<td>
<label for="cpass">Confirm Password</label>
</td>
<td>
<input type="password" id="cpass" onBlur="password()">
<div class="error" id="cpassword"></div>
</td>
</tr>
<tr>
<td>
<label for="em">Enter Email-ID</label>
</td>
<td>
<input type="email" id="em" onBlur="email()">
<div class="error" id="emailid"></div>
</td>
</tr>
<tr>
<td colspan=2>
<button type="submit" class="btn">Submit</button>
</td>
</tr>
</table>
</form>
はあなたに
作業例を作成するために、StackOverflowのコードブロックを使用してあなたの質問を編集してください。 –