加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

input只能输入数字(正则简析)

发布时间:2020-12-14 00:43:22 所属栏目:百科 来源:网络整理
导读:项目中有酱紫一个需求,输入金额的input,只能输入数字(正,负,零),最开始我天真的用了h5的新属性‘ type=number’ 解决,结果呢,,,obviously,,,不兼容!!!首先火狐就不兼容。只好另择它路。 既然这样子以本人愚见,有两个路子。1、可以在提交的

项目中有酱紫一个需求,输入金额的input,只能输入数字(正,负,零),最开始我天真的用了h5的新属性‘type=number’解决,结果呢,,,obviously,,,不兼容!!!首先火狐就不兼容。只好另择它路。

既然这样子以本人愚见,有两个路子。1、可以在提交的时候判断,提示用户这个字段输入格式不符合要求。2、在input上绑定keyup事件,当输入的为非数字的时候,通过js给它过滤掉。经与客户交流后,选择了第二种。

页面上就是绑定个keyup事件

<input type='text'  ng-keyup="filter(value)" ng-model='value'/>

每次点击将其他类型的值过滤掉。

$scope.filter= function(value){
    //因为当用户只输入一个“-”负号时候会被解析为字符串从而被过滤掉,所以需要分开判断
    if(value.length==1){
        var parttern=/[0-9-]/;
        var matches=parttern.exec(value);
        value=Array.isArray(matches)?matches[0]:'';
    }else{
        var parttern=/(-|+)?d+/g;
        var matches=parttern.exec(value);
        console.log(RegExp.leftContext)
        value=Array.isArray(matches)?matches[0]:''; 
    }

这样每次输入都会闪烁,暂时还没找到更好的解决方式

下边是一些正则的备忘录

‘^’符号,所有的解释都为“匹配输入字符串的开始位置。如果设置了RegExp对象的Multiline属性,^也匹配“n”或“r”之后的位置”。通俗的解释一下,就是当有^符号存在是,expression必须以parttern开头才能匹配的上。

var text="index.aspx?test=1&ww=2";
 var pattern =/?(w+=w+&)+w+=w+/;
 console.log(pattern.test(text));          //结果为true
 var pattern1=/^?(w+=w+&)+w+=w+/;
 console.log(pattern1.test(text));         //结果为false,因为text没有依据pattern1打头

‘$’与‘^’类似,只不过是结束符号,就不在赘述。

[^?#]中括号内以^开头,表示,除了‘?#’以外的所有字符。


正则在线测试网站:http://tool.oschina.net/regex/
所有正则符号解释:http://www.cnblogs.com/yirlin/archive/2006/04/12/373222.html

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读