angularJS限制 input-text 只能输入数字
最初的目的是为了让输入的字段仅为数字,不要包含英文,理所当然想到了正则表达,比起对每一个字符判断ASCII码要方便的多
JS正则表达式的使用,可以参考正则表达式
以match为例,全局匹配非数字
var reg = /\D/g;
var str = "abc12def";
var result = str.match(reg); //['abc','def']
结果会以数组的形式展示,因此不难发现,若数组长度为0,则全为数字。
但是,以怎样的形式表达“输入的字符全是数字”比较稳妥?
各有说法,有人认为通过字符过滤,当用户输入非数字时,字符会显示一瞬间然后因为不符合过滤要求被删除。
参考了张志成在知乎上的回答,一种只保留数字的简单写法。
<input type="text" id="text" ng-model="item.attr" ng-keyup="clearNum(item,'attr')">
var app = angular.module("myApp",[]);
app.controller("myCtrl", function ($scope) {
$scope.clearNum = function(obj, attr){
obj[attr] = obj[attr].replace(/\D/g,"");
}
});
但是这样的效果用户体验很糟糕。
未完待续。。。。明天更!
angularJS限制 input-text 只能输入数字的更多相关文章
- input text 只能输入数字 js 正则表达式
$("#txt1").keyup(function () { $(this).val($(this).val().replace(/[^0-9.]/g, '')); }).bind ...
- input text 只能输入数字
添加 onkeyup="value=value.replace(/[^\d]/g,'')"
- html input验证只能输入数字,不能输入其他
html input验证只能输入数字,不能输入其他 此方法为借鉴别人的,在此只做记录. <input type="text" onkeyup="if(!/^\d+$ ...
- input输入框只能输入数字和 小数点后两位
//input输入框只能输入数字和 小数点后两位 function num(obj,val){ obj.value = obj.value.replace(/[^\d.]/g,"" ...
- Html限制input输入框只能输入数字
限制输入框只能输入数字, onafterpaste防止用户从其它地方copy内容粘贴到输入框: <input type="text" onkeyup="this.v ...
- input 输入框 只能输入数字、字母、汉字等
1.文本框只能输入数字代码(小数点也不能输入) <input onkeyup="this.value=this.value.replace(/\D/g,'')" onafte ...
- 使用正则限制input框只能输入数字/英文/中文等等
常用HTML正则表达式 1.只能输入数字和英文的: 复制代码代码如下: <input onkeyup="value=value.replace(/[/W]/g,'') " o ...
- input输入框 只能输入数字 oninput = "value=value.replace(/[^\d]/g,'')" input输入框输入大于0的数字 oninput="value=value.replace(/\D|^0/g,'')"
项目中因为利用 element-ui 和avue两个ui框架搭建的 1.利用element-ui自带的校验需要注意点 prop :rules ref这三个属性 2.利用oninput时间进行校验 ...
- javascript判断input框只能输入数字的方法
javascript 只允许输入数字有很多方法,总结如下 1,只允许输入数字和小数点. <input onKeypress="return (/[\d.]/.test(String.f ...
- js控制input框只能输入数字和一位小数点和小数点后面两位小数
<script language="JavaScript" type="text/javascript"> function clearNoNum( ...
随机推荐
- Codeforces 1240A. Save the Nature
传送门 显然可以二分答案 如果知道卖的票数,那么就能算出有多少 $a$ 倍数但不是 $b$ 倍数的位置,多少 $b$ 倍数但不是 $a$ 倍数的位置,多少既是 $a$ 又是 $b$ 倍数的位置 然后贪 ...
- SpringBoot 进阶
SpringBoot 进阶 这里讲两个小方面: 表单验证 AOP 1. 表单验证 SpringBoot 中的表单验证功能步骤如下: 在 controller 类中将用 @PathVariable 和 ...
- Java实现的基础数据结构
Java实现的基础数据结构 0,常用的基础数据结构 图1 基础数据结构&相关特性 图2 Java自带的类集框架&继承关系图 1,数组[Array] 特点:长度固定.查找方便[直接使用i ...
- Java进阶开发-基于Base64的加密与解密操作
基于Base64的加密与解密操作 正常来讲加密基本上永远伴随着解密,所谓的加密或者解密往往都是需要有一些所谓的规则.在JDK1.8开始提供有一组新的加密处理操作,Base64处理.在这个类里面有两个内 ...
- 学生管理系统利用arrayList第二次优化
package StuManage; public class Student { private String name;//姓名 private String stuNum;//学号 privat ...
- C#面向对象20 序列化和反序列化
序列化和反序列化 序列化是把一个内存中的对象的信息转化成一个可以持久化保存的形式,以便于保存或传输,序列化的主要作用是不同平台之间进行通信,常用的有序列化有json.xml.文件等 一.序列化为j ...
- JS基础_if语句
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- spring配置文件定时器
在实际工作中,经常需要使用到定时任务,很多地方都会需要这种功能,比如做数据备份.同步等操作. 今天终于抽出时间总结了一下,写一个小例子: 基本使用: spring的定时任务使用起来十分方便,只需要两步 ...
- ASP.NET实现验证码图片
新建一个checkcode.aspx文件,页面中不用写任何东西,在代码中,Page_Load中写入如下代码: string chkCode = string.Empty; int ix, ...
- Gitlab创建ssh key并添加配置
1 生成ssh key zj改成你自己的邮箱或者名字之类的 ssh-keygen -t rsa -C "zj" 2 找到你生成的ssh key copy 公钥 添加到gitlab ...