我如何撰寫一個函式,在用戶點擊后退按鈕時覆寫表單驗證?
如果用戶沒有填寫表格并點擊提交,它將顯示"請填寫這個欄位"。 然后我添加了一個回傳按鈕,以防用戶不想填表而想回傳。 但在點擊時顯示 "請填寫此欄位"
當用戶點擊回傳時,我如何覆寫這一點呢? 。function validateForm() {
var x = document. forms["myForm"]["fname"].value。
if (x == "") {
alert("name must be filled out")。
return false;
}
}
function goBack() {
window.history.back()
}
<div class="form-div"> /span>
<form name="myForm" action="action_page. onsubmit="return validateForm()" method="post" required>
<button onclick="goBack()"/span>> 回傳</按鈕>
<div class="container"/span>>
<h1>Register</h1>
<p>請填寫此表格以創建一個帳戶。</p>
<hr>/span>
<label for="name">/span>< b>全名</b></label>
<i class="fa-user icon"/span>> </i>>
< input type="text" placeholder="enter Name" name="fullName"/span> id="name"/span> required>
<label for="email"> <。 b>Email</b></label>
<i class="fa-envelope icon"/span>> </i>>
< input type="text" placeholder="enter Email" name="email"/span> id="email"/span> required>
<label for="psw"> < b>密碼</b></label>>
<i class="fa fa-key icon"> </i>>
< input type="password" placeholder="password" id="psw" name="psw" pattern=" ( ? =.*d)(?=.*[a-z])(?=.*[A-Z]). {8,}" title="必須包含至少一個數字和一個大寫和小寫字母,以及至少8個以上的字符" required> /span>
<label for="psw-repeat">/span>< b>重復密碼</b></<i class="fa fa-key icon"> </i>>
< input type="password" placeholder="重復密碼" name="psw-repeat"/span> id="psw-repeat"/span> required>
<p>通過創建賬戶,您同意我們< a href="#">Terms & Privacy< /a> . </p>。
<button type="submit"/span> class="registerbtn"/span>> 注冊</按鈕>
</div>/span>
<div class="container signin">/span>
<p>已經有一個賬戶?<a href="#"/span>> 登錄</a>/span>。 </p>。
</div>/span>
</form>
</div>/span>
<iframe name="sif1" sandbox="allow-forms allow-modals allow-scripts" class="snippet-box-edit snippet-box-result" frameborder="0"></iframe>
uj5u.com熱心網友回復:
我認為從你的表單標簽中洗掉 "required "屬性應該是好的,即使你在輸入中保留這個 "required "屬性。
uj5u.com熱心網友回復:
這種情況的發生是因為你在<form>中添加了按鈕,導致它被當作一個提交按鈕
。
請看這個。如何防止按鈕提交表單
所以基本上你可以回傳false,但它更容易直接洗掉<form>
FYI
總是自己檢查輸入的值,因為每個熟悉devTools的人都可以洗掉required屬性,然后向你的服務器發送空值
另一個提示
你必須在服務器中也檢查這些值,因為你有很多方法可以覆寫客戶端的檢查(你做客戶端的檢查只是為了用戶體驗)
轉載請註明出處,本文鏈接:https://www.uj5u.com/yidong/311804.html
標籤:
下一篇:socket.io的CORS問題
