angularjs中的验证input输入框只能输入数字和小数点

最新推荐文章于 2024-04-26 16:47:03 发布
最新推荐文章于 2024-04-26 16:47:03 发布
阅读量2.1w 收藏 2
点赞数
文章标签： angular angularjs javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/yinglgn/article/details/47002955
版权

把js的验证方法改成angular可使用的方法

angularjs文件的写法：

$scope.clearNoNum = function(obj,attr){

//先把非数字的都替换掉，除了数字和.
obj[attr] = obj[attr].replace(/[^\d.]/g,"");
//必须保证第一个为数字而不是.
obj[attr] = obj[attr].replace(/^\./g,"");
//保证只有出现一个.而没有多个.
obj[attr] = obj[attr].replace(/\.{2,}/g,"");
//保证.只出现一次，而不能出现两次以上
obj[attr] = obj[attr].replace(".","$#$").replace(/\./g,"").replace("$#$",".");

}


页面：

<input type="text" name="chargeid2" ng-model="item.chargeid2" ng-keyup="clearNoNum(item,'chargeid2')"  placeholder="" class="form-control input-sm" >

YINGLGN
关注
  • 0
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Angularjs中的验证input输入框只能输入数字和小数点的写法（推荐）
01-19
把js的验证方法改成angular可使用的方法 AngularJS文件的写法： $scope.clearNoNum = function(obj,attr){ //先把非数字的都替换掉，除了数字和. obj[attr] = obj[attr].replace(/[^\d.]/g,); //必须保证第一个为数字而不是. obj[attr] = obj[attr].replace(/^\./g,); //保证只有出现一个.而没有多个. obj[attr] = obj[attr].replace(/\.{2,}/g,); //保证.只出现一次，而不能出现两次以上 obj[attr]
AngularJS 表单数据验证及错误信息提示
weixin_30536513的博客
03-10 713
一、表单验证基本原理 　　表单验证包括两个主题： 定义验证规则，验证数据有效性。 显示验证结果，把验证结果以友好的方式显示给用户。 　　H5内置一些验证功能，并会显示内置的错误提示信息，先要禁用它，在<form>上加个novalidate特性。如下： 　　<form ng-submit=vm.submit(vm.form) novalidate="novali...
input的一些输入限制，正则校验只能输入数字，正则校验不能输入中文
Sunny_lxm的博客
10-17 1664
input的一些输入限制1、input输入框只能输入正整数和0；只能输入大于0的正整数；不能输入中文，可以输入正数、负数、小数和字母；如果是正数负数0，包括小数都可以；只能取到小数点后两位
el-input 限制输入框只能输入数字和小数
热门推荐
string佳佳的博客
10-08 3万+
oninput =“value=value.replace(/[^\d]/g,’’)” //只能输入数字 oninput =“value=value.replace(/[^0-9.]/g,’’)” //只能输入数字和小数 <el-input v-model="sjje" oninput ="value=value.replace(/[^0-9.]/g,'')" class="money ...
angularJS限制 input-text 只能输入数字
weixin_30670151的博客
07-04 862
最初的目的是为了让输入的字段仅为数字，不要包含英文，理所当然想到了正则表达，比起对每一个字符判断ASCII码要方便的多 JS正则表达式的使用，可以参考正则表达式 以match为例，全局匹配非数字 1 var reg = /\D/g; 2 var str = "abc12def"; 3 var result = str.match(reg); //['abc','def'] 结...
限制html文本框input只能输入数字和小数点
11-30
PS：js实现只能输入数字和小数点的文本框 <html><head><meta http-equiv="content-Type" content="text/html;charset=gb2312"><title>js 只能输入数字和小数点</title> [removed]
js控制文本框只输入数字和小数点的方法
12-11
本文实例讲述了js控制文本框只输入数字和小数点的方法。分享给大家供大家参考。具体实现方法如下： 代码如下:function clearNoNum(obj) {  obj.value = obj.value.replace(/[^\d.]/g, “”);//清除“数字”和“.”...
input输入框限制只能输入数字的方法
qq_32450471的博客
02-28 1万+
input输入框限制只能输入数字的方法
输入框校验只能输入数字，限制三个字符；输入字符不限，限制保留小数点后两位
weixin_46939404的博客
10-31 1207
输入框校验只能输入数字，限制三个字符；输入字符不限，限制保留小数点后两位
AngularJS入门（10）---输入验证
怕冷的北方姑娘
11-27 198
输入验证 设置输入验证，可以在用户输入数据时显示提示信息 &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;script src="https://cdn.staticfile.org/angular.js/1.4.6/angular.min.js"&gt;&lt;/sc
angular inputNumber指令输入框只能输入数字的实现
10-15
主要介绍了angular inputNumber指令输入框只能输入数字的实现，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
angular 表单验证器验证的同时限制输入的实现
12-11
angular里面对于表单验证，设置了很多指令。 也就是说不用自己写一些逻辑，直接绑定指令就行。 ng-app     启动你angular的模块  ng-controller 控制器，启动你angualr里面的逻辑代码作用在页面上 ng-options  循环你select里面的option标签，很好用的  ng-submit，表单提交执行的 novalidate  表单form配合后期检测的 ng-model  实现双数据绑定 ng-show 根据一定的逻辑实现显示 ng-cloak 绑定在节点上，防止节点渲染，angular指令闪烁 ng-class class类名根据你的逻辑，出现 n
AngularJS中type为number的输入框如何限制小数位数
学无止境
01-06 2万+
在做一个项目时，需要对输入框内容进行限制，只能输入两位小数。 首先要限制只能输入数字，这个很好实现，使用如下代码即可 required :该输入框必填 type=number :只能输入整数 如何允许输入两位小数呢？ 我们需要借助step属性（step是步长的意思） 目前而言，对step雄起的浏览器为IE10+, Chrome以及Opera浏览器。
angular2中input只允许输入数字，而且数字有千分位格式
maoguiyou的专栏
03-14 6249
直接奔主题，不扯淡：需求：在angular2表单中，input只允许用户输入数字，而且要把数字格式化显示，比如1000 =&gt; 1,000思考：用type=number能不能达到？ &lt;input type="number" class="form-control" ngModel="{{config.value|number}}" (ngModelChange)="config.valu...
angularJs控制input只能输入数字并且小数点后只能输入两位
I_LV_XJ的博客
05-24 6973
在使用angular开发webapp的时候有时候需要input只能输入数字，并且小数点只能是一个，小数点后只能输入两位小数； 在浏览器上我们可以使用onkeypress使用正则表达式来实现这样的需求，但是onkeypress在手机端是不管用的，使用 ng-keypress也是不行的（我使用的时候没有成功），这时候我们可以使用js来控制，实现这样的需求，代码如下：$("#withdraw").k
AngularJS input number 保留两位小数
JavaEE_Linux
05-31 1万+
在网上查询了好多说用step="0.01" 不能够满足ng-model 绑定的值 后来找到了currency-format="number"     <!-- type="number" step="0.01"  --> 可以保留三位小数 也算可以满足需求
element-ui校验表单只能输入数字
q879936814的博客
09-09 4946
接到需求，让表单中只能输入数字，使用v-model的.number可以实现，但是不能以0为开头；又试了rule加type=number校验，输入数组一直报输入的不是数字。最后使用了onkeyup方法。
vue快速入门（四十六）Router的安装与使用
最新发布
不起眼小菜菜的博客
04-26 629
步骤很详细，直接上教程……
elul输入框只能输入数字和小数点
11-22
可以使用JavaScript来实现elul输入框只能输入数字和小数点的功能，具体实现方法如下所示： ```javascript // 获取elul输入框元素 var elulInput = document.getElementById("elul-input"); // 给elul输入框绑定onkeydown事件 elulInput.onkeydown = function(event) { // 获取当前按下的键的keyCode var keyCode = event.keyCode; // 允许数字键、小数点键、删除键、退格键以及左右方向键 if ((keyCode >= 48 && keyCode <= 57) || (keyCode >= 96 && keyCode <= 105) || keyCode == 190 || keyCode == 110 || keyCode == 8 || keyCode == 46 || keyCode == 37 || keyCode == 39) { return true; } else { return false; } }; // 给elul输入框绑定onkeyup事件 elulInput.onkeyup = function(event) { // 获取elul输入框的值 var value = elulInput.value; // 将非数字和小数点的字符替换为空字符串 value = value.replace(/[^\d\.]/g, ""); // 将多余的小数点替换为空字符串 value = value.replace(/\.{2,}/g, "."); // 将小数点前面的多余的0去掉 value = value.replace(/^0+(\d+)/g, "$1"); // 将小数点后面的多余的0去掉 value = value.replace(/(\.\d+?)0+$/g, "$1"); // 将elul输入框的值设置为处理后的值 elulInput.value = value; }; ``` 在上述代码中，我们首先获取了elul输入框的元素，然后给它绑定了onkeydown和onkeyup事件。在onkeydown事件中，我们判断了当前按下的键是否是数字键、小数点键、删除键、退格键以及左右方向键，如果是则返回true，否则返回false，这样就可以限制elul输入框只能输入数字和小数点了。在onkeyup事件中，我们获取了elul输入框的值，然后使用正则表达式将非数字和小数点的字符替换为空字符串，将多余的小数点替换为空字符串，将小数点前面的多余的0去掉，将小数点后面的多余的0去掉，最后将elul输入框的值设置为处理后的值，这样就可以保证elul输入框中的数字和小数点的格式是正确的。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值