javascript验证手机号和实现星号(*)代替实例

 更新时间:2016年08月16日 11:37:04   投稿:daisy  
在我们日常开发中经常要验证客户输入的手机号是否正确,有的时候还需要将中间的四位或者前几位用星号(*)代替,那该如何实现呢?下面跟着小编一起来看看。

一、JavaScript替换手机号中间4位

// 匹配手机号首尾,以类似“123****8901”的形式输出
'12345678901'.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2');

示例

<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script type="text/javascript">
var phone='12345678901';
var dh=phone.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2');
alert (dh);
</script>
</head>

<body>
</body>
</html>

注意:此段正则匹配字符串中的连续11位数字,替换中间4位为*号,输出常见的隐匿手机号的格式。如果要仅得到末尾4位,则可以改成如下形式:

二、JavaScript替换手机号前7位

// 匹配连续11位数字,并替换其中的前7位为*号
'15110280327'.replace(/\d{7}(\d{4})/, '*******$1');

示例

<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script type="text/javascript">
var phone='12345678901';
var dh=phone.replace(/\d{7}(\d{4})/, '*******$1');
alert (dh);
</script>
</head>

<body>
</body>
</html>

补充注释:正则表达式中的括号即可用于分组,同时也用于定义子模式串,在replace()方法中,参数二中可以使用$n(n为数字)来依次引用模式串中用括号定义的字串。

三、JavaScript手机验证以及隐藏手机号码中间四位综合实例

<!doctype html>
<html lang="en">
<head>
 <meta charset="UTF-8" />
 <title>js手机号码验证以及隐藏中间四位数字</title>
 <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
 <input type="text" id="myText">
 <p>js手机验证以及隐藏手机号码中间四位</p>
 <input type="button" value="提交" id="subBtn">
 <script type='text/javascript'> 
 $(function(){
  $("#subBtn").click(function(){
  if($("#myText").val()==""){
  alert("手机号码不能为空")
  }else{
  if(iphoneCheck(myText)){
  alert("提交成功");
  var phone=$("#myText").val();
  var myphone=phone.substr(3,4);
  //alert(myphone)
  var lphone=phone.replace(myphone,"****");
  $("#myText").val(lphone);
  }else{
  alert("请输入正确的手机号码")
  }
  }
  
  function iphoneCheck(id){
  var temp=document.getElementById("myText");
  var re=/^[1][34587]\d{9}$/;//手机号码验证正则表达式
  if(re.test(temp.value)){
  return true;
  }else{
  return false;
  }
  }
  });
 });
 </script>
</body>
</html>

总结

以上就是javascript验证手机号与实现星号(*)代替效果的全部内容,希望本文的内容对大家日常使用JavaScript能有所帮助。

相关文章

  • javascript作用域、作用域链(菜鸟必看)

    javascript作用域、作用域链(菜鸟必看)

    下面小编就为大家带来一篇javascript作用域、作用域链(菜鸟必看)。小编觉得 挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-06-06
  • javascript实现英文首字母大写

    javascript实现英文首字母大写

    本文给大家总结了几种可以实现英文首字母大写的javascript脚本,另附上一个CSS的实现方法,非常的简单实用,这里推荐给大家,有需要的小伙伴可以参考下。
    2015-04-04
  • JavaScript交换两个变量方法实例

    JavaScript交换两个变量方法实例

    这篇文章主要介绍了JavaScript交换两个变量方法实例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2019-11-11
  • Ant Design Blazor 组件库的路由复用多标签页功能

    Ant Design Blazor 组件库的路由复用多标签页功能

    在 Ant Design Blazor 组件库中实现多标签页组件的呼声日益高涨。于是,我利用周末时间,结合 Blazor 内置路由组件实现了基于 Tabs 组件的 ReuseTabs 组件,需要的朋友跟随小编一起看看吧
    2021-07-07
  • 关于Javascript 的 prototype问题。

    关于Javascript 的 prototype问题。

    关于Javascript 的 prototype问题。...
    2007-01-01
  • js精准的倒计时函数分享

    js精准的倒计时函数分享

    这篇文章主要为大家分享了js实现精准的倒计时函数,如何实现倒计时模块,感兴趣的小伙伴们可以参考一下
    2016-06-06
  • 使用js在layui中实现上传图片压缩

    使用js在layui中实现上传图片压缩

    这篇文章主要介绍了使用js在layui中实现上传图片压缩,layui 是一款采用自身模块规范编写的前端 UI 框架,js上传图片压缩百度有很多方法,,需要的朋友可以参考下
    2019-06-06
  • js keycode快捷键大全 并附有简单使用说明

    js keycode快捷键大全 并附有简单使用说明

    js keycode快捷键大全 并附有简单使用说明,方便大家使用。
    2010-10-10
  • js获得当前系统日期时间的方法

    js获得当前系统日期时间的方法

    这篇文章主要介绍了js获得当前系统日期时间的方法,涉及javascript操作日期时间的相关技巧,非常简单实用,需要的朋友可以参考下
    2015-05-05
  • 关于Layui Table隐藏列问题

    关于Layui Table隐藏列问题

    今天小编就为大家分享一篇关于Layui Table隐藏列问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2019-09-09

最新评论