TEL:400-8793-956
当前位置:程序、服务器

angularJS中的按键验证

提问者: 近期获赞: 浏览人数: 发布时间:2020-12-23 14:15:43

 问:如何在angularjs中使用正则表达式验证文本字段,文本字段仅接受有效输入。

 
<输入类型= “文本”名称= “电话” />
在输入文字上方,我只能输入数字,输入字母时不接受。
 
 
答:创建html页面,并在下面的代码。其中的文本字段仅接受有效模式的基础。
 
<body ng-app =“ CodePenApp”>
 
  仅字母<input type =“ text” allow-pattern =“ [az]” />
  <br>
  仅NUMBER <input type =“ text” allow-pattern =“ \ d” />
  <br>
  仅字母拼写<input type =“ text” allow-pattern =“(\ d | [az])” />
  <br>
  仅WHITESPACE CHARACTERS <input type =“ text” allow-pattern =“ \ W” />
  <br>
  仅ABCDEFG <input type =“ text” allow-pattern =“ [ABCDEFG]” />
</ body>
为上述html代码创建控制器。
 
var app = angular.module(“ CodePenApp”,[]);
 
app.directive('allowPattern',[allowPatternDirective]);
 
函数allowPatternDirective(){
    返回{
        限制:“ A”,
        编译:function(tElement,tAttrs){
            返回函数(作用域,元素,属性){
        //我处理关键事件
                element.bind(“ keypress”,function(event){
                    var keyCode = event.which || event.keyCode; //我从事件中安全地按下了keyCode。
                    var keyCodeChar = String.fromCharCode(keyCode); //我从keyCode确定char。
 
          //如果keyCode char与允许的Regex模式不匹配,则不允许输入该字段。
                    如果(!keyCodeChar.match(new RegExp(attrs.allowPattern,“ i”))){
            event.preventDefault();
                        返回false;
                    }
 
                });
            };
        }
    };
}
上一篇: WordPress Savoy电子商务主题启用/禁用按钮
下一篇: 如何使用GSON库解析和读取JSON数组