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 相关文章推荐
让回调函数 showResponse 也带上参数的代码
Aug 13 Javascript
Jquery显示、隐藏元素以及添加删除样式
Aug 09 Javascript
javascript弹出页面回传值的方法
Jan 28 Javascript
JavaScript实现下拉菜单的显示和隐藏
Jan 05 Javascript
javascript中的作用域和闭包详解
Jan 13 Javascript
js replace()去除代码中空格的实例
Feb 14 Javascript
深入理解React Native原生模块与JS模块通信的几种方式
Jul 24 Javascript
jquery无缝图片轮播组件封装
Nov 25 jQuery
小程序实现搜索框功能
Mar 26 Javascript
layui: layer.open加载窗体时出现遮罩层的解决方法
Sep 26 Javascript
微信小程序关键字变色实现代码实例
Dec 13 Javascript
一文了解JavaScript用Element Traversal新属性遍历子元素
Nov 27 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
Oracle Faq(Oracle的版本)
2006/10/09 PHP
新版PHP极大的增强功能和性能
2006/10/09 PHP
phpMyAdmin安装并配置允许空密码登录
2015/07/04 PHP
Yii2.0中使用js异步删除示例
2017/03/10 PHP
PHP+redis实现微博的拉模型案例详解
2019/07/10 PHP
Laravel 使用查询构造器配合原生sql语句查询的例子
2019/10/12 PHP
List the Stored Procedures in a SQL Server database
2007/06/20 Javascript
Jquery插件写法笔记整理
2012/09/06 Javascript
将光标定位于输入框最右侧实现代码
2012/12/04 Javascript
Extjs4中tree的拖拽功能(可以两棵树之间拖拽) 简单实例
2013/12/08 Javascript
jquery text()方法取标签中的文本
2014/07/25 Javascript
不使用ajax实现无刷新提交表单
2014/12/21 Javascript
CKEditor无法验证的解决方案(js验证+jQuery Validate验证)
2016/05/09 Javascript
AngularJS入门示例之Hello World详解
2017/01/04 Javascript
vue的状态管理模式vuex
2017/11/30 Javascript
原生JS实现ajax与ajax的跨域请求实例
2017/12/01 Javascript
详解Vue-cli中的静态资源管理(src/assets和static/的区别)
2018/06/19 Javascript
详解vue服务端渲染浏览器端缓存(keep-alive)
2018/10/12 Javascript
Vue项目总结之webpack常规打包优化方案
2019/06/06 Javascript
js回溯法计算最佳旅行线路代码实例
2019/09/11 Javascript
javascript实现的图片预览和上传功能示例【兼容IE 9】
2020/05/01 Javascript
js实现缓动动画
2020/11/25 Javascript
NodeJS配置CORS实现过程详解
2020/12/02 NodeJs
[06:36]吞吞映像top1
2014/06/20 DOTA
Python基础练习之用户登录实现代码分享
2017/11/08 Python
python3的UnicodeDecodeError解决方法
2019/12/20 Python
Python 模拟生成动态产生验证码图片的方法
2020/02/01 Python
美国时尚大码女装购物网站:Avenue
2019/05/24 全球购物
人事行政主管岗位职责
2013/12/22 职场文书
手机被没收检讨书
2014/02/22 职场文书
亮剑精神演讲稿
2014/05/23 职场文书
建筑施工安全责任书
2014/07/24 职场文书
推广普通话共筑中国梦演讲稿
2014/09/21 职场文书
2015年元旦联欢晚会活动总结
2014/11/28 职场文书
2019各种承诺书范文
2019/06/24 职场文书
漫画「狩龙人拉格纳」公开TV动画预告图
2022/03/22 日漫