jquery验证手机号是否正确实例讲解


Posted in Javascript onNovember 17, 2015

如果要做手机号的验证,那么我们需要知道手机号码的号段。
//移动号码归属地支持号段:134 135 136 137 138 139 147 150 151 152 157 158 159 178  182 183 184 187 188

//联通号码归属地支持号段:130 131 132  145 155 156 176  186 

//电信号码归属地支持号段:133 153 177 180 181 189 
//移动运营商:170

移动:
2G号段(GSM):134-139、150、151、152、158-159;
3G号段(TD-SCDMA):157、187、188、147.
联通:
2G号段(GSM):130-132、155-156;
3G号段(WCDMA):185、186.
电信:
2G号段(CDMA):133、153;
3G号段(CDMA2000):180、189.
可以写出一个正则表达式:var myreg = /^(((13[0-9]{1})|(14[0-9]{1})|(17[0]{1})|(15[0-3]{1})|(15[5-9]{1})|(18[0-9]{1}))+\d{8})$/; 
<input type="text" id="phone" name="phone" />
首先引入一个JQuery框架:

<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.0.js">
</script>

 校验手机号的函数:

//验证手机号
     function vailPhone(){
       var phone = jQuery("#phone").val();
       var flag = false;
       var message = "";
       var myreg = /^(((13[0-9]{1})|(14[0-9]{1})|(17[0]{1})|(15[0-3]{1})|(15[5-9]{1})|(18[0-9]{1}))+\d{8})$/;       
       if(phone == ''){
         message = "手机号码不能为空!";
       }else if(phone.length !=11){
         message = "请输入有效的手机号码!";
       }else if(!myreg.test(phone)){
         message = "请输入有效的手机号码!";
       }else if(checkPhoneIsExist()){
         message = "该手机号码已经被绑定!";
       }else{
           flag = true;
       }
       if(!flag){
      //提示错误效果
         //jQuery("#phoneDiv").removeClass().addClass("ui-form-item has-error");
         //jQuery("#phoneP").html("");
         //jQuery("#phoneP").html("<i class=\"icon-error ui-margin-right10\"> <\/i>"+message);
         //jQuery("#phone").focus();
       }else{
            //提示正确效果
         //jQuery("#phoneDiv").removeClass().addClass("ui-form-item has-success");
         //jQuery("#phoneP").html("");
         //jQuery("#phoneP").html("<i class=\"icon-success ui-margin-right10\"> <\/i>该手机号码可用");
       }
       return flag;
     }

发送请求给后台:

//验证手机号是否存在
       function checkPhoneIsExist(){
         var phone = jQuery("#phone").val();
         var flag = true;
         jQuery.ajax(
          { url: "checkPhone?t=" + (new Date()).getTime(),
            data:{phone:phone},
            dataType:"json",
               type:"GET",
               async:false,
               success:function(data) {
               var status = data.status;
               if(status == "0"){
                 flag = false;
               }
             }
        });
        return flag;
       }

java后端进行校验:

@RequestMapping(value = "/checkPhone", method = RequestMethod.GET)
  public void checkPhone(HttpServletRequest request,HttpServletResponse response) {
    
    Map<String, Object> map = new HashMap<String, Object>();
    try {
      String phone = request.getParameter("phone");
      String status = "0";
      //写查询逻辑,查出有的话,那么标记为1,否则标记为0
            //UserCellphoneAuth userCellphoneAuth = userService.findUserCellphoneAuthByPhone(phone);
      //if(userCellphoneAuth!=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) {
      logger.error(ex.getMessage(), ex);
    }
  }

以上就是本文的全部内容,教大家如何进行jquery验证手机号是否正确,利用正则表达式,大家可以动手试一试。

Javascript 相关文章推荐
JavaScript 设计模式学习 Factory
Jul 29 Javascript
让javascript加载速度倍增的方法(解决JS加载速度慢的问题)
Dec 12 Javascript
jQuery中ajax的post()方法用法实例
Dec 26 Javascript
JS取得绝对路径的实现代码
Jan 16 Javascript
Jquery结合HTML5实现文件上传
Jun 25 Javascript
浅析JavaScript 箭头函数 generator Date JSON
May 23 Javascript
Javascript基础_标记文字的实现方法
Jun 14 Javascript
Ajax异步获取html数据中包含js方法无效的解决方法
Feb 20 Javascript
VUE + UEditor 单图片跨域上传功能的实现方法
Feb 08 Javascript
node实现简单的增删改查接口实例代码
Aug 22 Javascript
分享一款超好用的JavaScript 打包压缩工具
Apr 26 Javascript
浅析JavaScript中的变量提升
Jun 01 Javascript
跟我学习javascript的prototype使用注意事项
Nov 17 #Javascript
js弹出对话框方式小结
Nov 17 #Javascript
跟我学习javascript的prototype,getPrototypeOf和__proto__
Nov 17 #Javascript
Jquery 垂直多级手风琴菜单附源码下载
Nov 17 #Javascript
JavaScript代码实现禁止右键、禁选择、禁粘贴、禁shift、禁ctrl、禁alt
Nov 17 #Javascript
跟我学习javascript的undefined与null
Nov 17 #Javascript
跟我学习javascript的arguments对象
Nov 16 #Javascript
You might like
PHP实现的比较完善的购物车类
2014/12/02 PHP
PHP安装memcached扩展笔记
2015/05/28 PHP
php基于闭包实现函数的自调用(递归)实例分析
2016/11/11 PHP
thinkPHP中U方法加密传递参数功能示例
2018/05/29 PHP
用javascript获取地址栏参数
2006/12/22 Javascript
JObj预览一个JS的框架
2008/03/13 Javascript
JavaScript中通过闭包解决只能取得包含函数中任何变量最后一个值的问题
2010/08/12 Javascript
Jquery 表单验证类介绍与实例
2013/06/09 Javascript
jquery固定底网站底部菜单效果
2013/08/13 Javascript
如何让浏览器支持jquery ajax load 前进、后退功能
2014/06/12 Javascript
jQuery实现可高亮显示的二级CSS菜单效果
2015/09/01 Javascript
jquery.validate使用详解
2016/06/02 Javascript
jQuery插件EasyUI实现Layout框架页面中弹出窗体到最顶层效果(穿越iframe)
2016/08/05 Javascript
微信小程序 实例应用(记账)详解
2016/09/28 Javascript
Angular.JS实现无限级的联动菜单(使用demo)
2017/02/08 Javascript
详解可以用在VS Code中的正则表达式小技巧
2019/05/14 Javascript
vue计算属性无法监听到数组内部变化的解决方案
2019/11/06 Javascript
在vue中封装的弹窗组件使用队列模式实现方法
2020/07/23 Javascript
vue3.0 加载json的方法(非ajax)
2020/10/26 Javascript
python运行其他程序的实现方法
2017/07/14 Python
idea创建springMVC框架和配置小文件的教程图解
2018/09/18 Python
对Xpath 获取子标签下所有文本的方法详解
2019/01/02 Python
实例详解python函数的对象、函数嵌套、名称空间和作用域
2019/05/31 Python
详解python中的time和datetime的常用方法
2019/07/08 Python
python3 线性回归验证方法
2019/07/09 Python
在脚本中单独使用django的ORM模型详解
2020/04/01 Python
Python多线程:主线程等待所有子线程结束代码
2020/04/25 Python
Python-split()函数实例用法讲解
2020/12/18 Python
HTML5触摸事件演化tap事件介绍
2016/03/25 HTML / CSS
沙龙级头发造型工具:FOXYBAE
2018/07/01 全球购物
附答案的Java面试题
2012/11/19 面试题
学生请假条格式
2014/04/11 职场文书
2015感人爱情寄语
2015/02/26 职场文书
优秀党员主要事迹范文
2015/11/05 职场文书
Win11 21h2可以升级22h2吗?看看你的电脑符不符合要求
2022/07/07 数码科技
前端传参数进行Mybatis调用mysql存储过程执行返回值详解
2022/08/14 MySQL