郵箱格式驗證程式碼詳解

antzone發表於2017-04-10

通常情況下,網站的使用者註冊或者其他操作,如果涉及到郵箱的填寫,都會進行格式驗證。

下面就分享一下如何實現郵箱格式正確性的驗證功能。

一.郵箱的格式:

明確郵箱的格式,才能夠知道如何去驗證。

[JavaScript] 純文字檢視 複製程式碼
登入名@主機名.域名

郵箱由@分隔:

左邊:登陸名。

右邊:完整的主機名,它由主機名與域名 組成。其中,域名由幾部分組成,每一部分稱為一個子域(Subdomain),各子域之間用圓點“.”隔開,每個子域都會告訴使用者一些有關這臺郵件伺服器 的資訊。

二.驗證程式碼例項:

[HTML] 純文字檢視 複製程式碼
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>螞蟻部落</title>
<script>
function vailEmail() {
  var ospan = document.getElementById("error");
  var email = jQuery("#email").val();
  var message = "";
  var myreg = /^([\.a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(\.[a-zA-Z0-9_-])+/;
  if (email == '') {
    message = "郵箱不能為空!";
  }
  else if (!myreg.test(email)) {
    message = "請輸入有效的郵箱地址!";
  }
  else {
    message = "郵箱格式正確";
  }
  ospan.innerHTML = message;
}
window.onload = function () {
  var obt = document.getElementById("bt");
  obt.onclick = function () {
    vailEmail()
  }
}
</script>
</head>
<body>
<input type="text" id="email"/><br/>
<span id="error"></span><br/>
<input type="button" id="bt" value="檢視效果"/>
</body>
</html>

相關文章