suchen

Heim >Web-Frontend >H5-Tutorial >HTML5+JavaScript zur Überprüfung der E-Mail-Adresse

HTML5+JavaScript zur Überprüfung der E-Mail-Adresse

巴扎黑
巴扎黑Original
2017-03-19 14:44:002970Durchsuche

<!doctype html>
<html>
<head>
<meta charset=utf-8 />
<title>html5 网页特效 邮箱地址验证</title>
<style>
body, input, textarea {
  font-family: "helvetica", arial, helvetica;
}
label {
  display: block;
  float: left;
  clear: left;
  text-align: right;
  width: 100px;
  margin-right: 10px;
}
p { padding: 10px; }
fieldset { border: 1px solid #ccc; margin-bottom: 20px; }
</style>
</head>
<body>
<form>
  <fieldset>
    <legend>some bits about you</legend>
    <p><label for="email">email:</label> <input id="email" name="email" type="email" /></p>
    <p><label for="url">homepage:</label><input id="url" type="url" name="url" required /></p> 
    <p><textarea name="comment" cols="100" rows="5" required></textarea></p>
  </fieldset>
  <input type="submit" />
</form>
<script>
// default validation messages
var messages = {
  email: &#39;be not a legal email address&#39;,
  url: &#39;be not a valid web address&#39;,
  comment: &#39;ye have to specify ye value&#39;
};
var forms = document.getelementsbytagname(&#39;form&#39;), i = forms.length, j, el;
while (i--) {
  j = forms[i].length;
  while (j--, el = forms[i][j]) {
    if (el.willvalidate && messages[el.name]) {
      el.setcustomvalidity(messages[el.name]);
    }
  }
}
</script>
<script>
var form = document.getelementsbytagname(&#39;form&#39;)[0];
form.onsubmit = function (event) {
  var i = this.length, el, cont = true, errors = [];
  while (i--, el = this[i]) {
    if (el.willvalidate) {
      if (!el.validity.valid) {
        errors.push(&#39;error with &#39; + el.name + (el.validationmessage ? &#39;: &#39; + el.validationmessage: &#39;&#39;));
        cont = false;
      }
    }
  }
  
  if (errors.length) {
    // replace alert with your sexy css教程 info bubbles
    alert(errors.join(&#39;n&#39;));
  }
  return cont;
};
</script>
</body>
</html>

Das obige ist der detaillierte Inhalt vonHTML5+JavaScript zur Überprüfung der E-Mail-Adresse. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：Ausführliche Erläuterung der HTML5-Benutzer- und Benutzergruppenverwaltungsbefehle unter LinuxNächster Artikel：Ausführliche Erläuterung der HTML5-Benutzer- und Benutzergruppenverwaltungsbefehle unter Linux

In Verbindung stehende Artikel

Mehr sehen