我在一個HTML頁面中有一個表單,其中有一個腳本來檢查表單中的欄位,問題是每當我在欄位中寫一些“錯誤”的東西并且腳本給出一個 時alert(),表單的所有欄位都會被清除。
這是代碼:
<html>
<head>
<title>Login</title>
<link rel="stylesheet" href="style.css">
<link rel="icon" href="loginIcon.png">
<script src="script.js"></script>
</head>
<body>
<form id="form" method="POST">
<div class="center"><input type="text" placeholder="E-mail" id="email" name="email"></div>
<div class="center"><input type="password" placeholder="Password" id="pass" name="pass"></div>
<div><input type="checkbox" class="check" id="check"> I'm not a Robot</div>
<div class="center"><button onclick="check()">LOGIN</button></div>
<a href="#">Don't have an account yet? Sign Up</a>
</form>
</body>
</html>
和腳本:
function check() {
var em = document.getElementById("email").value.trim()
var ps = document.getElementById("pass").value.trim()
var ch = document.getElementById("check")
if (ch.checked) {
if (em == "" || em == undefined) {
alert("Email missing")
return false
} else if (ps == "" || ps == undefined) {
alert("Password missing")
return false
} else {
if (!em.includes("@")) {
alert("Missing '@'")
return false
} else if (ps.length > 16) {
alert("Password must be 16 characters or less")
return false
} else {
document.getElementById("form").action = "check.php"
}
}
} else {
alert("You're a Robot!")
return false
}
}
uj5u.com熱心網友回復:
將您的表格更改為此
<form id="form" action="check.php" method="POST" onsubmit="return check()">
<div class="center"><input type="text" placeholder="E-mail" id="email" name="email"></div>
<div class="center"><input type="password" placeholder="Password" id="pass" name="pass"></div>
<div><input type="checkbox" class="check" id="check"> I'm not a Robot</div>
<div class="center"><button type="submit">LOGIN</button></div>
<a href="#">Don't have an account yet? Sign Up</a>
</form>
現在,表單是在警報后提交的,您需要在表單提交時設定此事件,以便在錯誤的情況下停止表單提交。
onsubmit 接收一個布林值(默認為真),所以如果你從函式回傳假,提交將被暫停(如這里所做的那樣)。
轉載請註明出處,本文鏈接:https://www.uj5u.com/ruanti/311244.html
標籤:javascript html 形式
上一篇:當單個HTTP請求發生錯誤時,導航到新頁面或停留在同一頁面上
下一篇:如何從Angular形式修剪值?
