今天看了看,前端同事的代码,居然发现了 他的控制 金额 输入的方式,挺好的,学习一下了。
下面是代码
金额 : * js :function onlyNumber(obj){ //得到第一个字符是否为负号 var t = obj.value.charAt(0); //先把非数字的都替换掉,除了数字和. obj.value = obj.value.replace(/[^\d\.]/g,''); //必须保证第一个为数字而不是. obj.value = obj.value.replace(/^\./g,''); //保证只有出现一个.而没有多个. obj.value = obj.value.replace(/\.{2,}/g,'.'); //保证.只出现一次,而不能出现两次以上 obj.value = obj.value.replace('.','$#$').replace(/\./g,'').replace('$#$','.'); obj.value = obj.value.replace(/^(\-)*(\d+)\.(\d\d).*$/,'$1$2.$3'); //如果第一位是负号,则允许添加 if(t == '-'){ return; } }
这个是后台页面,大家把重点放在 js 好吧。 他这里写是 能输入 - 负号,其实是不可以的.
另一种方式
当然如果 不要求那么高体验的话, 也可以这样
只能输入 数字, 保留2位小数 onkeyup="if(isNaN(value))execCommand('undo')" onchange="changeInput()" function changeInput(){ var $value= $("#"+id).val(); if( $.trim($value)=="" || isNaN($value) ){ $("#"+id).val(""); return ; } $("#"+id).val(parseFloat($value).toFixed(2)); }// 使用改变事件,强行变为 有两位小数的 值
var testMoney=/(^[1-9](\d+)?(\.\d{1,2})?$)|(^(0){1}$)|(^\d\.\d{1,2}?$)/; //正则金额 $("#money").bind("input propertychange", function(){ var nowMoney=$("#money").val(); if(nowMoney==""){ return; } if(!testMoney.test(nowMoney)){ if( nowMoney.substring(nowMoney.length-1,nowMoney.length)=="." && nowMoney.indexOf(".")== (nowMoney.length-1) ){ // 说明此时最后是 点号,金额没有输入完 return; } $("#money").val(""); return ; }});
另一种更方便的:
只能有两位小数,再次校验是否是数字即可
<input type="text" name="price" id='price' οnkeyup="if( ! /^\d*(?:\.\d{0,2})?$/.test(this.value)){alert('只能输入数字,小数点后只能保留两位');this.value='';}" />
另一种 更加的方便实用
就是 这个了, 直接可以控制非负 数字的输入,同时保留了2位小数
<input type="number" name="FirstName" οnkeyup="this.value = this.value.replace(/^(\-)*(\d+)\.(\d\d).*$/,'$1$2.$3');" />
注意 type="number" 是必须的