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


Posted in Javascript onMarch 28, 2018

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

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中的E-mail 地址格式验证

总结

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

Javascript 相关文章推荐
js不是基础的基础
Dec 24 Javascript
jQuery 使用手册(六)
Sep 23 Javascript
非阻塞动态加载javascript广告实现代码
Nov 17 Javascript
子页向父页传值示例
Nov 27 Javascript
两种方法基于jQuery实现IE浏览器兼容placeholder效果
Oct 14 Javascript
jQuery技巧之让任何组件都支持类似DOM的事件管理
Apr 05 Javascript
vue图片加载与显示默认图片实例代码
Mar 16 Javascript
详解angular中的作用域及继承
May 31 Javascript
基于JS对象创建常用方式及原理分析
Jun 28 Javascript
angularjs实现柱状图动态加载的示例
Dec 11 Javascript
Javascript防止图片拉伸的自适应处理方法
Dec 26 Javascript
vue动态绘制四分之三圆环图效果
Sep 03 Javascript
javascript性能优化之分时函数的介绍
Mar 28 #Javascript
Vue数据监听方法watch的使用
Mar 28 #Javascript
Vue 自定义动态组件实例详解
Mar 28 #Javascript
详解VUE 对element-ui中的ElTableColumn扩展
Mar 28 #Javascript
微信小程序之分享页面如何返回首页的示例
Mar 28 #Javascript
js中el表达式的使用和非空判断方法
Mar 28 #Javascript
JS实现左边列表移到到右边列表功能
Mar 28 #Javascript
You might like
星际争霸 Starcraft 游戏介绍
2020/03/14 星际争霸
Breeze 文章管理系统 v1.0.0正式发布
2006/12/14 PHP
php auth_http类库进行身份效验
2009/03/19 PHP
ThinkPHP实现批量删除数据的代码实例
2014/07/02 PHP
Laravel timestamps 设置为unix时间戳的方法
2019/10/11 PHP
JavaScript对象、属性、事件手册集合方便查询
2010/07/04 Javascript
基于jquery的$.ajax async使用
2011/10/19 Javascript
了解一点js的Eval函数
2012/07/26 Javascript
js实现选中复选框文字变色的方法
2015/08/14 Javascript
JavaScript对象数组排序函数及六个用法
2015/12/23 Javascript
有趣的bootstrap走动进度条
2016/12/01 Javascript
Javascript封装id、class与元素选择器方法示例
2017/03/13 Javascript
解决BootStrap Fileinput手机图片上传显示旋转问题
2017/06/01 Javascript
Node.js中流(stream)的使用方法示例
2017/07/16 Javascript
JS实现多物体运动的方法详解
2018/01/23 Javascript
vue实现的请求服务器端API接口示例
2019/05/25 Javascript
JavaScript定时器设置、使用与倒计时案例详解
2019/07/08 Javascript
基于javascript实现贪吃蛇小游戏
2019/11/25 Javascript
ES5新增数组的实现方法
2020/05/12 Javascript
python计数排序和基数排序算法实例
2014/04/25 Python
python通过zlib实现压缩与解压字符串的方法
2014/11/19 Python
在Python中使用cookielib和urllib2配合PyQuery抓取网页信息
2015/04/25 Python
Python实现扫描局域网活动ip(扫描在线电脑)
2015/04/28 Python
教你如何编写、保存与运行Python程序的方法
2019/07/12 Python
selenium+Chrome滑动验证码破解二(某某网站)
2019/12/17 Python
tensorflow之并行读入数据详解
2020/02/05 Python
python shell命令行中import多层目录下的模块操作
2020/03/09 Python
python复合条件下的字典排序
2020/12/18 Python
日本最大级玩偶手办购物:あみあみ Amiami
2018/04/23 全球购物
秋季运动会通讯稿
2014/01/24 职场文书
讲座主持词
2014/03/20 职场文书
自我鉴定总结
2014/03/24 职场文书
社区巾帼文明岗事迹材料
2014/06/03 职场文书
唐山大地震的观后感
2015/06/05 职场文书
礼貌问候语大全
2015/11/10 职场文书
nginx常用配置conf的示例代码详解
2022/03/21 Servers