工具篇 1

记录下日常开发有用到或封装的函数

1.邮箱验证正则公式

/^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(.[a-zA-Z0-9_-])+/
/^[A-Za-zd]+([-_.][A-Za-zd]+)*@([A-Za-zd]+[-.])+[A-Za-zd]{2,5}$/

来自项目使用过的例子：

var ret = /^[A-Za-z0-9]+([-_.][A-Za-z0-9]+)*@([A-Za-z0-9][-A-Za-z0-9]+).gov.hk+$/;
ret.test(str)

===========2019-05-25=======

过了一段时间，好像上面 👆 的验证效果不太满足现实需要，下面 👇 再补充个邮箱正则验证

/[\w!#$%&'*+/=?^_`{|}~-]+(?:\.[\w!#$%&'*+/=?^_`{|}~-]+)*@(?:[\w](?:[\w-]*[\w])?\.)+[\w](?:[\w-]*[\w])?/

2.用正则表达式获取 url 中的想要的参数（get 类型 URL）

function _getImgStrValue(str, key) {
    return str.match(new RegExp("(^|&|/?)" + key + "=([^&]*)(&|$)")) ? str.match(new RegExp("(^|&|/?)" + key + "=([^&]*)(&|$)"))[2] : ''
}

e.g.
var res = 'failed=0&start_time=201908010000&end_time=201908012359&time_dur=1439&interval=&tail=Radar/CAPPI_Ref_256km&tail_label=Reflectivity, 256km&num_files=24&ticket=nan&dummy='

var t_label = _getImgStrValue(res, 'tail_label’) // Reflectivity, 256km

只需调用上面 👆 方法，传想要获取数据的对应 key 关键字符，方法就会获取当前 window 的 URL 路径并与正则进行匹配，然后返回想要的数据。

3.限制 input 框只能输入数字或’-’,若输入则可看到但会立马消失

@使用参考代码

<input type="text" id="question" maxlength="100" style="width: 38.1%;display: inline-block;" class="form-control" autocomplete="off" onkeyup="value=value.replace(/[^\d-]/g,'')">

使用正则，可以帮助我们很快的实现一些验证/过滤性功能，下面 👇 是一些对 input 输入内容进行验证的正则表达式，实现若在 input 输入违规字符，可以看到但会立马消失

① 令 input 框只能输入数字或’-’,不能输入其他字符包括中英文、特殊字符onkeyup="value=value.replace(/[^\d-]/g,'')
② 令 input 框只能输入数字onkeyup="value=value.replace(/[^\d]/g,'')

4.对第 3.的补充和延伸学习

引用上面 👆第 3.，若要

③ 令 input 不能输入单引号、双引号，注意引号要为英文字符，如此便可让英式单引号和双引号时可以看到但也会被置空onkeyup="value=value.replace(/['\"]/g,'’)
④ 令 input 只能输入单双引号onkeyup="value=value.replace(/[^'\"]/g,’’)

好，下面说下两种 input 内容正则验证的不同，下图第一种方法会检测输入的每一个值，但不合适的会把整个 value 值置空。第二种方法好些，检测每一个值，但只是把不合规矩的置空，其他的不改变。

使用方式：

第一种方法 onkeyup="value=contentLimit(value)"
第二种方法 onkeyup="value=charactersLimit(value)"

5.数组比较，一个对象数组，一个普通数组，要从对象数组中找到有 name 值跟普通数组的元素值相同的，就从对象数组中删掉

案例（图是网上找的，下面代码把 name 改为 id 就可以了）

如下方法(可以兼容 IE)

function unique (obj, ary){
  return obj.filter(function(item){
    return ary.indexOf(item.name) == -1;
  })
}

如果最后改 return ary.indexOf(item.id) != -1，则会返回被删除掉的对象数组的元素数据. 当然，也有使用 ES6 的，一句代码搞定，不过不兼容 IEconst newArr = obj.filter(item => !ary.includes(item.id)),因为 array.includes()不支持 IE

6.实现选择好相关格式的日期后，在某地显示出大写的日期(日期格式要为 yyyy-mm-dd)

先定义个数组
var weekDay = ["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"]
var date = $('#releaseDate').val(); // 获取到日期的数值,且日期格式要为 2018-02-16

meetDate = date.split("-“); // 拼接成数组
var dt = new Date(meetDate[0],(meetDate[1]-1),meetDate[2]); // 月数要减1

$('#weekDay').text(weekDay[dt.getDay()]); // weekDay数组顺序要按上面排序

To be continued

工具篇1

记录下日常开发有用到或封装的函数