jquery验证邮箱格式是否正确实例讲解

 更新时间:2015年11月16日 13:55:11   作者:daliu_it  
这篇文章主要介绍了一个jquery验证邮箱格式是否正确的实践案例,利用正则表达式进行验证,感兴趣的小伙伴们可以参考一下

我们来看看都有哪些邮箱:

我们如果一个个的邮箱进行判断,显然是不可能的了。
—个完整的Internet邮件地址由以下两个部分组成,格式如下:登录名@主机名.域名
中间用—个表示“在”(at)的符号“@”分开,符号的左边是对方的登录名,右边是完整的主机名,它由主机名与域名 组成。其中,域名由几部分组成,每一部分称为一个子域(Subdomain),各子域之间用圆点“.”隔开,每个子域都会告诉用户一些有关这台邮件服务器 的信息。
关键验证的正则表达式: var myreg = /^([\.a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(\.[a-zA-Z0-9_-])+/;
校验输入框:

 //验证邮箱
     function vailEmail(){
       var email = jQuery("#email").val();
       var flag = false;
       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 if(checkEmailIsExist()){
         message = "该邮箱地址已经被注册!";
       }else{
         flag = true;
       }
       if(!flag){
          //错误提示
         //jQuery("#emailDiv").removeClass().addClass("ui-form-item has-error");
         // jQuery("#emailP").html("");
         //jQuery("#emailP").html("<i class=\"icon-error ui-margin-right10\">&nbsp;<\/i>"+message);
         //jQuery("#email").focus();
       }else{
         //正确提示
         //jQuery("#emailDiv").removeClass().addClass("ui-form-item has-success");
         //jQuery("#emailP").html("");
         //jQuery("#emailP").html("<i class=\"icon-success ui-margin-right10\">&nbsp;<\/i>该邮箱可用");
       }
       return flag;
     }

写一个方法来验证一下

 //验证邮箱是否存在
     function checkEmailIsExist(){
       var email = jQuery("#email").val();
       var flag = false;
       jQuery.ajax(
        { url: "checkEmail?t=" + (new Date()).getTime(),
          data:{email:email},
          dataType:"json",
             type:"GET",
             async:false,
             success:function(data) {
             var status = data.status;
             if(status == "1"){
               flag = true;
             }
           }
      });
      return flag;
     }

后台处理程序:

@RequestMapping(value = "/checkEmail", method = RequestMethod.GET)
  public void checkEmail(HttpServletRequest request,HttpServletResponse response) {
    
    Map<String, Object> map = new HashMap<String, Object>();
    try {
      String email = request.getParameter("email");
      
      String status = "0";
      //写查询语句,查询表里面是否存在该邮箱
      //UserBaseInfo userBaseInfo = userService.findUserByEmail(email); 
      //if(userBaseInfo!=null)status="1";
      map.put("status", status);
      
      String data = JSONObject.fromObject(map).toString();
     
      response.getWriter().print(data);
      response.getWriter().flush();
      response.getWriter().close();
    } catch (Exception ex) {
      
    }
  }

以上就是jquery验证邮箱格式是否正确实例代码,利用了正则表达式:var myreg = /^([\.a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(\.[a-zA-Z0-9_-])+/;,大家可以动手试一试。

相关文章

  • 基于jQuery实现点击弹出层实例代码

    基于jQuery实现点击弹出层实例代码

    基于jquery实现点击链接弹出层效果,其基本实现原理是这样的:jquery操作DOM元素。对层样式的设置。将display:设置为none;让层隐藏;对jq点击弹出层相关知识感兴趣的朋友一起学习吧
    2016-01-01
  • jquery 合并内容相同的单元格(示例代码)

    jquery 合并内容相同的单元格(示例代码)

    这篇文章主要是对jquery合并内容相同的单元格示例代码进行了介绍。需要的朋友可以过来参考下,希望对大家有所帮助
    2013-12-12
  • JQuery.uploadify 上传文件插件的使用详解 for ASP.NET

    JQuery.uploadify 上传文件插件的使用详解 for ASP.NET

    今天下午整理文件上传的例子,感觉收集到的例子都很不人性话,后来找到一个还可以的,本来想改成类似于腾讯QQ相册那种方式,仔细看了一下是Flash的, 而且那个极速上传插件也不知道用什么做的?问了一下,说是什么cgi. 搞得一头雾水
    2010-01-01
  • JQuery常见节点操作实例分析

    JQuery常见节点操作实例分析

    这篇文章主要介绍了JQuery常见节点操作,结合实例形式分析了jQuery针对元素节点的添加、删除常见操作函数使用技巧与相关注意事项,需要的朋友可以参考下
    2019-05-05
  • JQuery 绑定select标签的onchange事件,弹出选择的值,并实现跳转、传参

    JQuery 绑定select标签的onchange事件,弹出选择的值,并实现跳转、传参

    JQuery 绑定select标签的onchange事件,弹出选择的值,并实现跳转、传参(selected的值和页面其它元素的值)
    2011-01-01
  • jquery实现图片灯箱明暗的遮罩效果

    jquery实现图片灯箱明暗的遮罩效果

    这篇文章主要介绍了jquery实现图片灯箱明暗的遮罩效果,有需要的朋友可以参考一下
    2013-11-11
  • jquery 实现密码框的显示与隐藏示例代码

    jquery 实现密码框的显示与隐藏示例代码

    密码框的显示隐藏有多种实现方法,在将为大家介绍下如何使用jquery实现,感兴趣的朋友可以参考下
    2013-09-09
  • jQuery+css实现的切换图片功能代码

    jQuery+css实现的切换图片功能代码

    这篇文章主要介绍了jQuery+css实现的切换图片功能代码,涉及jQuery响应鼠标事件动态变换页面元素样式的相关技巧,需要的朋友可以参考下
    2016-01-01
  • jQuery中change事件用法实例

    jQuery中change事件用法实例

    这篇文章主要介绍了jQuery中change事件用法,以实例形式分析了在匹配元素焦点变化时触发事件使用技巧,具有一定的参考借鉴价值,需要的朋友可以参考下
    2014-12-12
  • ajax无刷新动态调用股票信息(改良版)

    ajax无刷新动态调用股票信息(改良版)

    今日闲来无事,把上次写的代码稍微改了改。增加了动态追加和删除股票信息的功能(代码基于jquery运行:http://jquery.com/) 。由于对Ajax技术的认识还只是在初级阶段,总觉得这么些有点别扭,希望大虾能够指点一二。
    2008-11-11

最新评论