你好，我寫了一個驗證姓名和電話號碼的代碼。我的驗證代碼有效，但即使兩個輸入都錯誤，我也只會收到第一個錯誤的驗證訊息。我希望兩者都顯示它是否錯誤，我不知道如何解決。
這是 ma javascript 代碼
function validate(){
var name = document.getElementById("name").value;
var phone = document.getElementById("phone").value;
var error_message = document.getElementById("error_message");
error_message.style.padding = "10px";
var text;
if(name.length <= 0){
text = "Please Enter valid Name";
error_message.innerHTML = text;
return false;
}
if(isNaN(phone) || phone.length != 10){
text = "Please Enter valid Phone Number";
error_message.innerHTML = text;
return false;
}
alert("Form Submitted Successfully!");
return true;
}
這是我的 html 代碼：
<script defer src="request.js" ></script>
<link rel="stylesheet" href="request.css">
<body>
<title>Request</title>
<div class="wrapper">
<h2>Signup For a Drive Test!</h2>
<div id="error_message">
</div>
<form action="" id="myform" onsubmit = "return validate();">
<div class="input_field">
<input type="text" placeholder="Name" id="name ">
</div>
<div class="input_field">
<input type="text" placeholder="Phone" id="phone">
</div>
uj5u.com熱心網友回復：
那是因為你覆寫了文本變數，你可以像這樣修復它
var text = "";
if(name.length >= 0){
text = "Please Enter valid Name <br>";
}
if(isNaN(phone) || phone.length != 10){
text = "Please Enter valid Phone Number ";
}
error_message.innerHTML = text;
uj5u.com熱心網友回復：
您return在每個 if 陳述句中都進行了檢查，因此該函式會立即回傳并且不會繼續進行下一次檢查。此外，當有if(name.length >= 0){名稱時將回傳 true ，而不是當它為空白時。將大于值翻轉為小于值。
uj5u.com熱心網友回復：
例如，一個好的做法是收集陣列中的所有錯誤，而不是在每個條件中回傳，而是設定一個變數來查看是否有錯誤：
<script>
function validate() {
var name = document.getElementById("name").value;
var phone = document.getElementById("phone").value;
var error_message = document.getElementById("error_message");
error_message.style.padding = "10px";
var text;
var errors = [];
var isValid = true;
if (name.length >= 0) {
text = "Please Enter valid Name";
errors.push(text);
isValid = false;
}
if (isNaN(phone) || phone.length != 10) {
text = "Please Enter valid Phone Number";
errors.push(text);
isValid = false;
}
if (!isValid) {
error_message.innerHTML = errors.join(" & ");
return false;
}
alert("Form Submitted Successfully!");
return true;
}
</script>
uj5u.com熱心網友回復：
所以一個好主意是用簡單的英語大聲讀出你的代碼。這樣你就會發現你的邏輯錯誤。
所以基本上，如果 name.length 大于 0 那么它是一個無效的名稱？我不明白這是你想要的。
改成這樣——
if(name.length < 1){
text = "Please Enter valid Name";
error_message.innerHTML = text;
return false;
}
也盡量不要重新設計你的實作在每個驗證步驟后不回傳。
轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/437236.html
標籤：javascript html 网络