Angularjs中的验证input输入框只能输入数字和小数点的写法（推荐）

把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" >

总结

以上所述是小编给大家介绍的Angularjs中的验证input输入框只能输入数字和小数点的写法，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对我们网站的支持！

赞 (0)

相关推荐

  • 关于JavaScript限制字数的输入框的那些事

    关于JavaScript限制字数的输入框的那些事

    前言 最近产品需要做不少输入框,产品想要的交互效果是:用户可以输入中英文,随着用户输入能实时显示已经输入的字符个数,当超过数量限制时输入框边框变红,同时给用户提示信息. 这交互听起来没啥问题,技术实现上似乎也没啥难点.但是当我实现出来以后遇到中文输入法就有坑了. 怎么个坑呢,且看下文~~ 实时监测输入框内容长度所遇到的坑使用 oninput事件来监听 使用这个oninput事件的好处有2个: 当用户通过右键复制改变输入框内容时,可以监听到: 只有在输入框内容发生变化时才会触发此事件,比如用户按下

  • JavaScript动态提示输入框输入字数的方法

    本文实例讲述了JavaScript动态提示输入框输入字数的方法.分享给大家供大家参考.具体如下: 在QQ空间里有小纸条那么一个功能,随着你在文本框中输入多少字,上面会动态提示你"已经输入多少字"和"还可以输入多少字",觉得挺好的,所以自己也试着做做,呵呵.   开始,我想很多人第一感觉就是通过js的 onkeydown或者onkeyup来做,中发现还可以用focus + setInterval() +blur来达到我们需要的效果,于是很快的我利用这种方法自己粗糙的写

  • Javascript实现真实字符串剩余字数提示的实例代码

    复制代码 代码如下: //文本框剩余字数提示(字符大小) function textLimitCheckSj(thisArea, maxLength, SpanId) {     var str = thisArea.value;     if (getChrLen(str, maxLength) > maxLength * 2) {         thisArea.value = str.substring(0, x-1);     }     else {         var vars

  • .NET+JS对用户输入内容进行字数提示功能的实例代码

    第一步:以下是核心代码,在页面引用或进行封装都可. 复制代码 代码如下: <script language="javascript" type="text/javascript"> function textLimitCheck(thisArea, maxLength, SpanId) { if (thisArea.value.length > maxLength) { thisArea.value = thisArea.value.substri

  • AngularJS实现的输入框字数限制提醒功能示例

    AngularJS实现的输入框字数限制提醒功能示例

    本文实例讲述了AngularJS实现的输入框字数限制提醒功能.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>www.jb51.net AngularJS字数提示</title> </head> <style> *{ margin:0; paddi

  • JavaScript中统计Textarea字数并提示还能输入的字符

    现在流行的Twitter等微博客网站,有一个很好的用户体验,就是在文本框中输入文字的时候,会自动统计输入的字符,并显示用户还能输入的字符,在限制了140个字的微博客中,这样的小提示可以很好的增强用户体验. 如果实现这种技术呢,我进行了一些研究,发现实现其实挺简单,几行代码就能完成输入字符统计功能,经过实际测试,其对文字的统计与Twitter等微博客的完全相同. 使用方法是,先增加一个span,用于显示剩余的字数,然后在Textarea中,加入一个onkeydown和onkeyup的事件,调用另一

  • 利用Angularjs和原生JS分别实现动态效果的输入框

    利用Angularjs和原生JS分别实现动态效果的输入框

    在刚开始没有给输入框添加焦点之前,没有任何效果.见下图: 然后点击其中任何一个,焦点就会触发一个动画,动画的结果见图二: 中间的输入登录密码文字,会自动添加到顶部(原谅我没有截取到动画过程的图片). 我测试了一下,这样的效果只有高级浏览器支持(IE只有IE10.IE11.Edge支持). 下面我来把代码贴上来,原理很简单,就是通过事件触发类名的增加和删除.具体的动画由CSS3来实现,这也是为什么低级浏览器不支持的原因. 原生JS实现示例: <!DOCTYPE html> <html la

  • JavaScript输入框字数实时统计更新

    JavaScript输入框字数实时统计更新

    在前端开发中,很多情况下需对输入内容进行验证.实时统计功能,对于定长输入而言,可以让用户实时明确输入界限,并合理安排内容. 字数实时统计更新 下面将以[消息内容]为例,设计实现输入框字数实时统计更新功能. 项目架构如下: message  message.css     message.js     message.tpl 1. 在message.tpl文件中定义网页元素 //移动端微信公众号开发 <div class="weui-cell__bd"> <textar

  • Angularjs中的验证input输入框只能输入数字和小数点的写法（推荐）

    把js的验证方法改成angular可使用的方法 AngularJS文件的写法: $scope.clearNoNum = function(obj,attr){ //先把非数字的都替换掉,除了数字和. obj[attr] = obj[attr].replace(/[^\d.]/g,""); //必须保证第一个为数字而不是. obj[attr] = obj[attr].replace(/^\./g,""); //保证只有出现一个.而没有多个. obj[attr] = o

  • JS通过正则限制 input 输入框只能输入整数、小数(金额或者现金) 两位小数

    第一: 限制只能是整数 <input type = "text" name= "number" id = 'number' onkeyup= "if(! /^d+$/.test(this.value)){alert('只能整数');this.value='';}" /> 如果不是整数就直接alert 第二: 限制是两位的小数 <input type = "text" name= "price&quo

  • 使用正则限制input框只能输入数字/英文/中文等等

    常用HTML正则表达式 1.只能输入数字和英文的: 复制代码 代码如下: <input onkeyup="value=value.replace(/[/W]/g,'') " onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^/d]/g,''))" ID="Text1" NAME="Text1">

  • jquery教程限制文本框只能输入数字和小数点示例分享

    复制代码 代码如下: $(function(){                 /*JQuery 限制文本框只能输入数字*/              $(".NumText").keyup(function(){                        $(this).val($(this).val().replace(/\D|^0/g,''));                  }).bind("paste",function(){  //CTR+V事

  • js 只能输入数字和小数点的文本框改进版

    1.鼠标左右移动的时候. 2.最后一个不能是小数点. js 只能输入数字和小数点 //by ahuinan 2009-4-10 function clearNoNum(event,obj){ //响应鼠标事件,允许左右方向键移动 event = window.event||event; if(event.keyCode == 37 | event.keyCode == 39){ return; } //先把非数字的都替换掉,除了数字和. obj.value = obj.value.replace

  • js限制输入框只能输入数字(onkeyup触发)

    例子:html代码 <input type="text" name="" id="box" /> 通常都直接用: <input type="text" name="" id="box" onkeyup="value=value.replace(/[^\d]/g,'')"/> 以上的缺点是,当你正确输入的是一串数字后,想用光标移动到前面修改其中的

  • angular inputNumber指令输入框只能输入数字的实现

    1.建立一个独立模块用于作为公用指令的模块 1)生成模块 ng g m directive 2)进入指令模块目录 cd directive 3)生成一个只能输入数字的指令类 ng g d numberinput 4)指令模块directive.module.ts代码如下 import { NgModule, ModuleWithProviders } from '@angular/core'; import { CommonModule } from '@angular/common'; imp

  • 让html的text输入框只能输入数字和1个小数点(0-59之间可改)

    text 数字 function check(event) { var e = window.event || event; var target = e.srcElement || e.target; var k = e.keyCode; if(isFunKey(k)) { return true; } var c = getChar(k); if(target.value.length == '' && (c == '-' || c == '+')) { return true; }

  • JS控制只能输入数字并且最多允许小数点两位

    下面通过一段代码给大家介绍JS控制只能输入数字并且最多允许小数点两位,具体代码如下所示: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <input type="text" name="

  • 解析使用js判断只能输入数字、字母等验证的方法(总结)

    JS判断只能是数字和小数点0.不能输入中文1)<input onpaste="return false;" type="text" name="textfield" style="width:400px; ime-mode:disabled" value="">2)<script>function chkIt(frm){if (frm.n1.value.length>0&

随机推荐