JavaScript中的E-mail 地址格式验证

 更新时间:2018年03月28日 15:10:26   作者:贾继康  
本文给大家分享JavaScript中的E-mail 地址格式验证,项目要求输入的数据必须包含@符号和点号。代码简单易懂,非常不错,具有参考借鉴价值,需要的朋友参考下吧

最近做了一个前端的项目,要求:输入的数据必须包含 @ 符号和点号(.)。同时,@ 不可以是邮件地址的首字符,并且 @ 之后需有至少一个点号。

1:代码

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>利用JavaScript验证是否符合电子邮箱地址</title>
</head>
<script type="text/javascript">
  // 创建第一个函数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>
<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:结果

这里写图片描述 

 下图则说明了自己输入的邮箱格式是准确的,至于存在不存在另当别论!

这里写图片描述

总结

以上所述是小编给大家介绍的JavaScript中的E-mail 地址格式验证,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!

相关文章

  • JavaScript制作弹出层效果

    JavaScript制作弹出层效果

    弹出层效果大家在网站上经常遇到此功能,下面小编给大家分享一段js代码制作弹出层效果,代码简单易懂,非常不错,需要的朋友参考下吧
    2016-12-12
  • RequireJS多页面应用实例分析

    RequireJS多页面应用实例分析

    这篇文章主要介绍了RequireJS多页面应用实例分析的相关资料,非常不错,具有参考借鉴价值,需要的朋友可以参考下
    2016-06-06
  • IE6下javasc#ipt:void(0) 无效的解决方法

    IE6下javasc#ipt:void(0) 无效的解决方法

    本篇文章主要是对IE6下javasc#ipt:void(0) 无效的解决方法进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助
    2013-12-12
  • JavaScript实现鼠标滑过图片变换效果的方法

    JavaScript实现鼠标滑过图片变换效果的方法

    这篇文章主要介绍了JavaScript实现鼠标滑过图片变换效果的方法,涉及javascript控制鼠标事件及样式变换的技巧,非常具有实用价值,需要的朋友可以参考下
    2015-04-04
  • JavaScript 读URL参数增强改进版版

    JavaScript 读URL参数增强改进版版

    网上有不少JavaScript 读 URL 参数的函数,但没考虑到 URL 中带 # 符的情况,我的可以处理这种情况,并使用了点对象写法,优化了些性能。
    2008-10-10
  • javascript forEach函数实现代码

    javascript forEach函数实现代码

    在Base2中找到一个叫forEach的函数,是我见过的最好的实现。挖出来分析一下。它能对各种普通对象,字符串,数组以及类数组进行遍历。如果原游览器的对象已实现此函数,它则调用原对象的函数。
    2010-01-01
  • js中复选框的取值及赋值示例详解

    js中复选框的取值及赋值示例详解

    这篇文章主要给大家介绍了关于js中复选框的取值及赋值的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-10-10
  • 利用JavaScript编写Python内置函数查询工具

    利用JavaScript编写Python内置函数查询工具

    Python有丰富的内置函数实现各种功能,但查询内置函数时总是需要百度查,有没有一个小工具可以单机无网络查询Python内置函数,方便自己学习编写Python程序呢?本文就来用JavaScript编写一个
    2023-02-02
  • 函数式编程入门实践(一)

    函数式编程入门实践(一)

    这篇文章主要介绍了Javascript函数式编程,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-04-04
  • 基于javascript实现按圆形排列DIV元素(一)

    基于javascript实现按圆形排列DIV元素(一)

    本篇文章主要介绍基于javascript实现按圆形排列DIV元素的方法,此文着重于介绍对实现的按圆形排列DIV元素的分析,需要的朋友来看下吧
    2016-12-12

最新评论