最近做了一個前端的項目,要求:輸入的數據必須包含 @ 符號和點號(.)。同時,@ 不可以是郵件地址的首字符,并且 @ 之后需有至少一個點號。
1:代碼
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>利用JavaScript驗證是否符合電子郵箱地址</title> </head> <script type="text/javascript"> // 創(chuàng)建第一個函數validate_emil()并包含兩個參數 function validate_email(field, alerttxt) { with (field) { //利用indexOf() 方法返回某個指定的字符串值在字符串中首次出現的位置--定義一個變量apos將第一次出現的“@”賦值給apos apos = value.indexOf("@"); //利用lastIndexOf() 方法返回一個指定的字符串值最后出現的位置,在一個字符串中的指定位置從后向前搜索-- //stringObject.lastIndexOf(searchvalue,fromindex) //fromindex 可選的整數參數。規(guī)定在字符串中開始檢索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略該參數,則將從字符串的最后一個字符處開始檢索。 dotpos = value.lastIndexOf("."); // 判斷符合"@"的位置,或者"."的位置是否在"@"的后面 if (apos < 1 || dotpos - apos < 2) { // 利用alert()彈出一個警告窗來執(zhí)行alerttxt的操作 // 郵箱地址不符合 alert(alerttxt); return false; } else { // 郵箱地址符合 return true; } } } // 創(chuàng)建第二個函數validate_form()并包含一個參數 function validate_form(thisform) { with (thisform) { if (validate_email(email, "Not a valid e-mail address!") == false) { // 利用focus()將輸入焦點移至對象上 email.focus(); return false; } } } </script> <body> <!-- onsubmit是一個驗證表單功能,為true提交, --> <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>
2:結果
下圖則說明了自己輸入的郵箱格式是準確的,至于存在不存在另當別論!
相信看了本文案例你已經掌握了方法,更多精彩請關注Gxl網其它相關文章!
推薦閱讀:
Vue把html字符串轉化為HTML步驟詳解
$http方法傳遞json參數步驟詳解
聲明:本網頁內容旨在傳播知識,若有侵權等問題請及時與本網聯系,我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com