需求一

image.png

源码

  • JS ``` //全局公用的对数据脱敏处理方法 参数可以是单个也可以是多个,但是格式必须是字符串 function publicDesensitization(){ //先将内置的 arguments 转换为真正的数组 var dataArr = Array.prototype.slice.apply(arguments); for (var i = 0; i < dataArr.length; i++) {

    1. var data = dataArr[i];
    2. // 正则判断返回相应数据
    3. if(/(^\d{18}$)|(^\d{17}(\d|X|x)$)/.test(data) || /^(13[0-9]|16[0-9]|19[0-9]|147|15[0-9]|17[6-8]|18[0-9])\d{8}|17[0-9]\d{8}$/.test(data) || /(^(?:(?![IOZSV])[\dA-Z]){2}\d{6}(?:(?![IOZSV])[\dA-Z]){10}$)|(^\d{15}$)/.test(data)){
    4. //身份证号 || 手机号 || 营业执照 前三后四
    5. data = data.substr(0,3) + "****" + data.substr(-4);
    6. }else if(/^(\w)+(\.\w+)*@(\w)+((\.\w+)+)$/.test(data)){
    7. //邮箱号码 前二 后以 @ 分割
    8. data = data.substr(0,2) + "****" + data.substr(data.indexOf('@'));
    9. }else if(/^\d{16}|\d{19}$/.test(data)){
    10. //银行卡号 后四位
    11. data = "****" + data.substr(-4);
    12. }else if(data.indexOf('公司') > -1){
    13. //企业名称 前二后四
    14. data = data.substr(0,2) + "****" + data.substr(-4);
    15. }else{
    16. return;
    17. }
    18. dataArr[i] = data;

    }

    return dataArr; } //测试输出,数据都是虚假的 身份证号 手机号 邮箱 企业名称 营业执照 银行卡号 console.log(publicDesensitization(‘13062119801124217X’,’13688888888’,’xiaochuan@qq.com’,’河南你想网络科技有限公司’,’914101003172188172’,’6228480402564890018’));

  1. - HTML

<!DOCTYPE html>

  1. - 在浏览器控制台输出效果图
  2. > ![image.png](http://upload-images.jianshu.io/upload_images/9064013-ec14829951defd6c.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

(6) [“130217X”, “1368888”, “xi@qq.com”, “河南有限公司”, “9148172”, “0018”]

  1. ##参考网址
  2. > [营业执照号正则验证 原文](d562df7b09f2af6a51bb51d4b6b101af)<br />
  3. [营业执照号正则验证 我的笔记](https://www.jianshu.com/p/039692471ca1)<br />
  4. #需求二
  5. - 最后实现的点击效果如下
  6. > ![GIF4.gif](http://upload-images.jianshu.io/upload_images/9064013-17702bd2c160e4aa.gif?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
  7. ##源码
  8. - JS

//全局公用的对脱敏数据点击显示与隐藏方法 参数可以是单个也可以是多个,但是必须字符串类型的 Dom 元素 例:.name function publicClickToogle() { //先将内置的 arguments 转换为真正的数组 var dataArr = Array.prototype.slice.apply(arguments); var nowDataArr = [];//存放脱敏数据的数组 var realDataArr = [];//存放真实数据的数组 for (var i = 0; i < dataArr.length; i++) { var Dom = dataArr[i]; nowDataArr.push($(Dom).text()); realDataArr.push($(Dom).attr(“data-str”)); (function(nowDataArr,realDataArr,i) { $(Dom).on(‘click’, function() { var nowData = nowDataArr[i]; //获取已脱敏处理的数据 console.log(nowData); var realData = realDataArr[i]; //获取后台传递的真实完成数据 if ($(this).text() == nowData) { $(this).text(realData); } else if ($(this).text() == realData) { $(this).text(nowData); } }) })(nowDataArr,realDataArr,i); } } //测试输出示例 publicClickToogle(‘#testData1’, ‘#testData2’);

  1. - HTML

<!DOCTYPE html>

简书地址

1368866

1368865

```