我有 3 個要驗證的欄位
<form name='Login' method='post' target='_self'>
<div ...>
<input id="accountLoginField" type="text" name="account" value="" placeholder="">
<input id="userLoginField" type="text" name="user" value="" placeholder="">
<input id="passLoginField" type="password" name="password" value=""
placeholder=""> ....
我有提交輸入
<input id="btn_login" type="submit" name="submit" class="buttonM bBlue" value="Connect">
如何檢查這些欄位是否為空并顯示警告框？我嘗試了在這里和其他網站上找到的不同方法，但它們似乎都不起作用......謝謝
uj5u.com熱心網友回復：
您可以使用 if 和 else 進行驗證，并使用values屬性進行檢查，例如您可以參考的示例代碼，
function validateform(){
var name=document.myform.name.value;
var password=document.myform.password.value;
if (name==null || name==""){
alert("Name can't be blank");
return false;
}else if(password.length<6){
alert("Password must be at least 6 characters long.");
return false;
}
}
</script>
<body>
<form name="myform" method="post" action="abc.jsp" onsubmit="return validateform()" >
Name: <input type="text" name="name"><br/>
Password: <input type="password" name="password"><br/>
<input type="submit" value="register">
</form>
同樣，您可以檢查每個欄位。
uj5u.com熱心網友回復：
以下示例將提交到實時測驗服務器，并且回應將顯示在一個<iframe>用于演示目的。客戶端驗證是最小的，當然服務器應該在驗證方面做繁重的作業。以下是要點：
- 確保提交按鈕在
<form>. 如果由于某種原因不是，請添加form="*"到它（"*"是的 id<form>）。雖然<form>擁有 a是完全有效的name，但 anid在 example 中更有用<form id='login'...>。 - 每個欄位都有一個
required屬性，因此可以在觸發“提交”事件時對其進行驗證，第一個空白<input>將有一個彈出視窗。 - 第一個
<input>type已更改為"email"，如果用戶忘記，驗證將停止提交@。
<form id='login' action='https://httpbin.org/post' method='POST' target='response'>
<fieldset>
<input name="account" type="email" placeholder="Email address" required>
<input name="user" type="text" placeholder='User name' required>
<input name="password" type="password" placeholder="Password" required>
<input type="submit" value="Connect">
</fieldset>
</form>
<label>These two buttons are outside of form.</label><br>
<input type='submit' form='login' value='Works'>
<input type='submit' value="Doesn't Work"><br>
<iframe name='response'></iframe>轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/454905.html
標籤：javascript 验证