javascript表單驗證大全_javascript技巧
被 JavaScript 驗證的這些典型的表單資料有以下幾種：
1.使用者是否已填寫表單中的必填項目？
2.使用者輸入的郵件地址是否合法？
3.使用者是否已輸入合法的日期？
4.使用者是否在資料域 (numeric field) 中輸入了文字？
以下是使用者名稱和密碼驗證碼：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<script>
function validateForm()
{
var username = document.forms["myForm"]["username"].value;
var password = document.forms["myForm"]["password"].value;
alert(username+" "+password);
}
</script>
</head>
<body>
<form name="myForm" action="" onSubmit=" return validateForm()" method="post">
用户名:<input type="text" name="username"/><br/>
密码:<input type="password" name="password"/><br/>
<input type="submit" value="提交"/>
</form>
</body>
</html>必填（或必選）項目驗證：
下面的函數用來檢查使用者是否已填入表單中的必填（或必填）項目。假如必填或必選項為空，那麼警告框會彈出，並且函數的回傳值為 false，否則函數的回傳值則為 true（表示資料沒有問題）：
function validate_required(field,alerttxt)
{
with (field)
{
if (value==null||value=="")
{alert(alerttxt);return false}
else {return true}
}
}以下是連同 HTML 表單的程式碼：
<html>
<head>
<script type="text/javascript">
function validate_required(field,alerttxt)
{
with (field)
{
if (value==null||value=="")
{alert(alerttxt);return false}
else {return true}
}
}
function validate_form(thisform)
{
with (thisform)
{
if (validate_required(email,"Email must be filled out!")==false)
{email.focus();return false}
}
}
</script>
</head>
<body>
<form action="submitpage.htm" onsubmit="return validate_form(this)" method="post">
Email: <input type="text" name="email" size="30">
<input type="submit" value="Submit">
</form>
</body>
</html>
E-mail 驗證
下面的函數檢查輸入的資料是否符合電子郵件地址的基本語法。
意思是說，輸入的資料必須包含 @ 符號和點號(.)。同時，@ 不可以是郵件地址的首字符，並且 @ 之後需有至少一個點號：
function validate_email(field,alerttxt)
{
with (field)
{
apos=value.indexOf("@")
dotpos=value.lastIndexOf(".")
if (apos<1||dotpos-apos<2)
{alert(alerttxt);return false}
else {return true}
}
}以下是連同 HTML 表單的完整程式碼：
以上程式碼是使用者名稱、密碼、必填、必選項和email以及連同表單的程式碼，希望對大家學習javascript表單驗證有所幫助。
熱AI工具
Undresser.AI Undress
人工智慧驅動的應用程序，用於創建逼真的裸體照片
AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。
Undress AI Tool
免費脫衣圖片
Clothoff.io
AI脫衣器
Video Face Swap
使用我們完全免費的人工智慧換臉工具，輕鬆在任何影片中換臉！
熱門文章
熱工具
記事本++7.3.1
好用且免費的程式碼編輯器
SublimeText3漢化版
中文版，非常好用
禪工作室 13.0.1
強大的PHP整合開發環境
Dreamweaver CS6
視覺化網頁開發工具
SublimeText3 Mac版
神級程式碼編輯軟體(SublimeText3)
php如何使用CodeIgniter4框架？
May 31, 2023 pm 02:51 PM
PHP是一種非常流行的程式語言，而CodeIgniter4是一種常用的PHP框架。在開發Web應用程式時，使用框架是非常有幫助的，它可以加速開發過程、提高程式碼品質、降低維護成本。本文將介紹如何使用CodeIgniter4框架。安裝CodeIgniter4框架CodeIgniter4框架可以從官方網站（https://codeigniter.com/）下載。下
Laravel開發：如何使用Laravel Validation驗證表單請求？
Jun 13, 2023 pm 01:34 PM
Laravel是一個流行的PHPWeb開發框架，它提供了許多方便的功能來加快開發者的工作。其中，LaravelValidation是一種非常實用的功能，它可以幫助我們輕鬆驗證表單請求和使用者輸入的資料。本文將介紹如何使用LaravelValidation驗證表單請求。什麼是LaravelValidationLaravelValidation是La
如何使用Flask-WTF實現表單驗證
Aug 03, 2023 pm 06:53 PM
如何使用Flask-WTF實作表單驗證Flask-WTF是一個用於處理Web表單驗證的Flask擴展，它提供了一種簡潔、靈活的方式來驗證使用者提交的資料。本文將向您展示如何使用Flask-WTF擴充來實作表單驗證。安裝Flask-WTF要使用Flask-WTF，首先需要安裝它。可以使用pip指令來安裝：pipinstallFlask-WTF導入所需模組在F
如何使用Golang實作網頁應用程式的表單驗證
Jun 24, 2023 am 09:08 AM
表單驗證是Web應用程式開發中非常重要的環節，它能夠在提交表單資料之前對資料進行有效性檢查，避免應用程式出現安全漏洞和資料錯誤。使用Golang可以輕鬆實現網頁應用程式的表單驗證，本文將介紹如何使用Golang來實作網頁應用程式的表單驗證。一、表單驗證的基本要素在介紹如何實作表單驗證之前，我們需要知道表單驗證的基本要素是什麼。表單元素：表單元素是指
如何在Laravel中使用中間件處理表單驗證
Nov 02, 2023 pm 03:57 PM
如何在Laravel中使用中間件處理表單驗證，需要具體程式碼範例引言：在Laravel中，表單驗證是非常常見的任務。為了確保使用者輸入的資料的有效性和安全性，我們通常會對表單提交的資料進行驗證。 Laravel提供了一個方便的表單驗證功能，同時也支援使用中間件來處理表單驗證。本文將詳細介紹如何在Laravel中使用中間件處理表單驗證，並提供具體的程式碼範例
PHP表單驗證技巧：如何使用filter_input函數檢驗使用者輸入
Aug 01, 2023 am 08:51 AM
PHP表單驗證技巧：如何使用filter_input函數檢驗使用者輸入引言：在開發Web應用程式時，表單是與使用者互動的重要工具。而正確地驗證使用者輸入，是確保資料的完整性和安全性的關鍵步驟之一。 PHP提供了filter_input函數，可以方便地對使用者輸入進行驗證和過濾。本文將介紹如何使用filter_input函數來檢驗使用者輸入，並提供相關的程式碼範例。一、
PHP中的表單驗證和過濾方法？
Jun 29, 2023 pm 10:04 PM
PHP作為一種廣泛應用於Web開發的腳本語言，其表單驗證和過濾是非常重要的一部分。在使用者提交表單的過程中，需要對使用者輸入的資料進行驗證和過濾，以確保資料的安全性和有效性。本文將介紹PHP中如何進行表單驗證和篩選的方法和技巧。一、表單驗證表單驗證是指對使用者輸入的資料進行檢查，以確保資料符合特定的規則和要求。常見的表單驗證包括必填項目的驗證、信箱格式、手機號碼格
如何使用Hyperf框架進行表單驗證
Oct 20, 2023 pm 02:04 PM
如何使用Hyperf框架進行表單驗證引言：隨著Web應用程式的發展，表單驗證成為了保證資料的準確性和安全性的重要環節。 Hyperf框架作為高效能的PHP開發框架，提供了強大的表單驗證功能，本文將介紹如何使用Hyperf框架進行表單驗證，並提供具體的程式碼範例。一、安裝Hyperf框架：使用Composer進行安裝：composercreate-proje
