首頁 web前端 js教程 JS裡如何驗證E-mail正確地址

JS裡如何驗證E-mail正確地址

Apr 28, 2018 am 09:35 AM
javascript 驗證

這次帶給大家JS裡如何驗證E-mail正確地址,JS裡驗證E-mail正確地址的注意事項有哪些,下面就是實戰案例,一起來看一下。

最近做了一個前端的項目,要求:輸入的資料必須包含 @ 符號和點號(.)。同時,@ 不可以是郵件地址的首字符,並且 @ 之後需有至少一個點號。

1:代碼

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

nbsp;html>

 

 

<meta>

<title>利用JavaScript验证是否符合电子邮箱地址</title>

 

<script>

  // 创建第一个函数validate_emil()并包含两个参数

  function validate_email(field, alerttxt) {

    with (field) {

      //利用indexOf() 方法返回某个指定的字符串值在字符串中首次出现的位置--定义一个变量apos将第一次出现的“@”赋值给apos

      apos = value.indexOf("@");

      //利用lastIndexOf() 方法返回一个指定的字符串值最后出现的位置,在一个字符串中的指定位置从后向前搜索--

      //stringObject.lastIndexOf(searchvalue,fromindex)

      //fromindex 可选的整数参数。规定在字符串中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略该参数,则将从字符串的最后一个字符处开始检索。

      dotpos = value.lastIndexOf(".");

      // 判断符合"@"的位置,或者"."的位置是否在"@"的后面

      if (apos < 1 || dotpos - apos < 2) {

        // 利用alert()弹出一个警告窗来执行alerttxt的操作

        // 邮箱地址不符合

        alert(alerttxt);

        return false;

      } else {

        // 邮箱地址符合

        return true;

      }

    }

  }

  // 创建第二个函数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>

 

  <!-- onsubmit是一个验证表单功能,为true提交, -->

   

登入後複製
    Email:     

2:結果

JS裡如何驗證E-mail正確地址 

 下圖則說明了自己輸入的郵箱格式是準確的,至於存在不存在另當別論!

JS裡如何驗證E-mail正確地址

相信看了本文案例你已經掌握了方法,更多精彩請關注php中文網其它相關文章!

推薦閱讀:

controller接收js傳遞json參數

#js實作前後台Json互相傳送

以上是JS裡如何驗證E-mail正確地址的詳細內容。更多資訊請關注PHP中文網其他相關文章!

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱門文章

R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
1 週前 By 尊渡假赌尊渡假赌尊渡假赌
倉庫:如何復興隊友
3 週前 By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒險:如何獲得巨型種子
3 週前 By 尊渡假赌尊渡假赌尊渡假赌

熱門文章

R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
1 週前 By 尊渡假赌尊渡假赌尊渡假赌
倉庫:如何復興隊友
3 週前 By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒險:如何獲得巨型種子
3 週前 By 尊渡假赌尊渡假赌尊渡假赌

熱門文章標籤

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

如何在PDF中驗證簽名 如何在PDF中驗證簽名 Feb 18, 2024 pm 05:33 PM

如何在PDF中驗證簽名

微信好友輔助驗證解封的詳細方法 微信好友輔助驗證解封的詳細方法 Mar 25, 2024 pm 01:26 PM

微信好友輔助驗證解封的詳細方法

如何使用WebSocket和JavaScript實現線上語音辨識系統 如何使用WebSocket和JavaScript實現線上語音辨識系統 Dec 17, 2023 pm 02:54 PM

如何使用WebSocket和JavaScript實現線上語音辨識系統

PHP 8 新功能:增加了驗證和簽名 PHP 8 新功能:增加了驗證和簽名 Mar 27, 2024 am 08:21 AM

PHP 8 新功能:增加了驗證和簽名

WebSocket與JavaScript:實現即時監控系統的關鍵技術 WebSocket與JavaScript:實現即時監控系統的關鍵技術 Dec 17, 2023 pm 05:30 PM

WebSocket與JavaScript:實現即時監控系統的關鍵技術

如何使用WebSocket和JavaScript實現線上預約系統 如何使用WebSocket和JavaScript實現線上預約系統 Dec 17, 2023 am 09:39 AM

如何使用WebSocket和JavaScript實現線上預約系統

steam登入卡在手機令牌驗證怎麼解決? steam登入卡在手機令牌驗證怎麼解決? Mar 14, 2024 pm 07:35 PM

steam登入卡在手機令牌驗證怎麼解決?

如何利用JavaScript和WebSocket實現即時線上點餐系統 如何利用JavaScript和WebSocket實現即時線上點餐系統 Dec 17, 2023 pm 12:09 PM

如何利用JavaScript和WebSocket實現即時線上點餐系統

See all articles