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中几种常见排序算法小结
Feb 22 Javascript
jQuery内置的AJAX功能和JSON的使用实例
Jul 27 Javascript
jQuery的Scrollify插件实现滑动到页面下一节点
Jul 05 Javascript
JavaScript_ECMA5数组新特性详解
Jun 12 Javascript
基于Vue.js实现简单搜索框
Mar 26 Javascript
JS中的作用域链
Mar 01 Javascript
微信小程序之GET请求的实例详解
Sep 29 Javascript
Vue 实现展开折叠效果的示例代码
Aug 27 Javascript
webpack4+express+mongodb+vue实现增删改查的示例
Nov 08 Javascript
JavaScript常用工具函数库汇总
Sep 17 Javascript
vue封装自定义指令之动态显示title操作(溢出显示,不溢出不显示)
Nov 12 Javascript
react中的DOM操作实现
Jun 30 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删除页面记录 同时刷新页面 删除条件用GET方式获得
2012/01/10 PHP
PHP设计模式之单例模式定义与用法分析
2019/03/26 PHP
js资料toString 方法
2007/03/13 Javascript
在chrome浏览器中,防止input[text]和textarea在聚焦时出现黄色边框的解决方法
2011/05/24 Javascript
JQuery-tableDnD 拖拽的基本使用介绍
2013/07/04 Javascript
基于promise.js实现nodejs的promises库
2014/07/06 NodeJs
node.js中的querystring.escape方法使用说明
2014/12/10 Javascript
12306验证码破解思路分享
2015/03/25 Javascript
JavaScript中 ES6 generator数据类型详解
2016/08/11 Javascript
基于jquery实现多选下拉列表
2017/08/02 jQuery
Express + Session 实现登录验证功能
2017/09/08 Javascript
详解Vue路由History mode模式中页面无法渲染的原因及解决
2017/09/28 Javascript
详解微信小程序canvas圆角矩形的绘制的方法
2018/08/22 Javascript
判断js数据类型的函数实例详解
2019/05/23 Javascript
JavaScript 预解析的4种实现方法解析
2019/09/03 Javascript
微信小程序商品详情页底部弹出框
2019/11/22 Javascript
vue 开发之路由配置方法详解
2019/12/02 Javascript
JQuery表单元素取值赋值方法总结
2020/05/12 jQuery
python抓取网页图片示例(python爬虫)
2014/04/27 Python
python判断windows系统是32位还是64位的方法
2015/05/11 Python
Python构建XML树结构的方法示例
2017/06/30 Python
详解python里使用正则表达式的全匹配功能
2017/10/19 Python
详解python中的装饰器
2018/07/10 Python
使用matplotlib中scatter方法画散点图
2019/03/19 Python
Pytorch自己加载单通道图片用作数据集训练的实例
2020/01/18 Python
python matplotlib包图像配色方案分享
2020/03/14 Python
numpy实现RNN原理实现
2021/03/02 Python
水果花束:Fruit Bouquets
2017/12/20 全球购物
简历自荐信
2013/12/02 职场文书
经典团队口号
2014/06/06 职场文书
市场营销专业应届生自荐信
2014/06/19 职场文书
公司活动总结怎么写
2014/06/25 职场文书
三关爱志愿服务活动方案
2014/08/17 职场文书
2015年新学期寄语
2015/02/26 职场文书
Python实现自动玩连连看的脚本分享
2022/04/04 Python
关于Redis的主从复制及哨兵问题
2022/06/16 Redis