博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
input 控制只能输入非负金额的另一种方式
阅读量:7120 次
发布时间:2019-06-28

本文共 2021 字,大约阅读时间需要 6 分钟。

hot3.png

今天看了看,前端同事的代码,居然发现了 他的控制 金额 输入的方式,挺好的,学习一下了。

下面是代码

金额 : 															          			 *				 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" 是必须的

 

 

 

 

转载于:https://my.oschina.net/u/2419285/blog/1844965

你可能感兴趣的文章
Sql Server的艺术(二) SQL复杂条件搜索
查看>>
C#执行osql脚本时部分脚本未执行
查看>>
IIS服务命令
查看>>
Java基础之中间件的初识
查看>>
下载软件的临时文件思路和实现
查看>>
修改Linux系统默认编辑器
查看>>
C语言博客作业05--指针
查看>>
LeetCode 504. Base 7 (C++)
查看>>
QT多线程简单例子
查看>>
郑继明等《数值分析》习题解答
查看>>
----uni-app之APP更新及静默更新----
查看>>
关于内置函数
查看>>
Union的一个妙法
查看>>
找回密码forget_password
查看>>
用户体验评价
查看>>
客户端和服务器各种报错解释
查看>>
android asmack调用MultiUserChat.getHostedRooms方法出现空指针的异常解决方案
查看>>
RE管理器root explorer基础操作教程
查看>>
TFS首次安装与配置,极其注意事项<个人备用>
查看>>
tableview分割线
查看>>