单行 JS 实现移动端金钱格式的输入规则


Posted in Javascript onMay 22, 2017

金钱格式检验属于很普通的需求,记得工作中第一次遇到这个需求的时候,还不太会写正则表达式,搜到了一个类似的解决方案,看着正则的文档改成了自己需要的形式。

但是用户的输入操作是任意的,只是显示提示信息,这种方式虽然可以满足要求,但是感觉不友好。

其实移动端的很多应用在输入金钱时都是屏蔽错误输入,只能输入正确的格式。先看一看金钱格式的输入规则有哪些:

1. 不能输入空白字符及字母
2. 只能输入数字及小数点
3. 首位不能为小数点
4. 小数点只能出现一次
5. 小数点后只有两位
6. 不能输入首位是 0 的多位数

 看似很简单的问题,其实要考虑的很周全才可以。但是代码可以写的很简洁,我费了不少心思摸索出来的。对于校验部分确实只需要一行

function moneyFormat(str) {
  return str.replace(/[^\d\.]|^\./g, '').replace(/\.{2}/g, '.').replace(/^([1-9]\d*|0)(\.\d{1,2})(\.|\d{1})?$/, '$1$2').replace(/^0\d{1}/g, '0');
}

时间不早了,就写这么多吧,最后贴上我在 CodePen 写的 Demo,希望能帮到有需要的人。

单行 JS 实现移动端金钱格式的输入规则

以上所述是小编给大家介绍的单行 JS 实现移动端金钱格式的输入规则,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
js常用函数 不错
Sep 08 Javascript
JS面向对象编程浅析
Aug 28 Javascript
jQuery:delegate中select()不起作用的解决方法(实例讲解)
Jan 26 Javascript
jQuery事件绑定方法学习总结(推荐)
Nov 21 Javascript
微信小程序 picker 组件详解及简单实例
Jan 10 Javascript
Iphone手机、安卓手机浏览器控制默认缩放大小的方法总结(附代码)
Aug 18 Javascript
微信小程序表单验证form提交错误提示效果
Jun 19 Javascript
微信小程序实现圆形进度条动画
Nov 18 Javascript
node.js express框架实现文件上传与下载功能实例详解
Oct 15 Javascript
JavaScript实现HSL拾色器
May 21 Javascript
浅谈vue 组件中的setInterval方法和window的不同
Jul 30 Javascript
js和jquery判断数据类型的4种方法总结
Aug 28 jQuery
JavaScript表单验证实现代码
May 22 #Javascript
JQuery 封装 Ajax 常用方法(推荐)
May 21 #jQuery
原生JS实现N级菜单的代码
May 21 #Javascript
Ionic + Angular.js实现图片轮播的方法示例
May 21 #Javascript
详解Angular2中Input和Output用法及示例
May 21 #Javascript
Angular2中如何使用ngx-translate进行国际化
May 21 #Javascript
详解angularjs利用ui-route异步加载组件
May 21 #Javascript
You might like
PHP关联链接常用代码
2012/11/05 PHP
php中hashtable实现示例分享
2014/02/13 PHP
PHP网页游戏学习之Xnova(ogame)源码解读(八)
2014/06/23 PHP
php修改上传图片尺寸的方法
2015/04/14 PHP
php数据库的增删改查 php与javascript之间的交互
2017/08/31 PHP
使用jQuery的ajax功能实现的RSS Reader 代码
2009/09/03 Javascript
Jquery Change与bind事件代码
2011/09/29 Javascript
JavaScript调用堆栈及setTimeout使用方法深入剖析
2013/02/16 Javascript
Egret引擎开发指南之编译项目
2014/09/03 Javascript
javascript使用正则表达式实现去掉空格之后的字符
2015/02/15 Javascript
javascript动态创建表格及添加数据实例详解
2015/05/13 Javascript
JQuery的常用选择器、过滤器、方法全面介绍
2016/05/25 Javascript
js剪切板应用clipboardData实例解析
2016/05/29 Javascript
简单谈谈Javascript函数中的arguments
2017/02/09 Javascript
Bootstrap Tree View简单而优雅的树结构组件实例解析
2017/06/15 Javascript
Angular实现预加载延迟模块的示例
2017/10/12 Javascript
[07:03]显微镜下的DOTA2第九期——430圣堂刺客杀戮秀
2014/06/20 DOTA
[07:08]2014DOTA2西雅图国际邀请赛 小组赛7月11日TOPPLAY
2014/07/11 DOTA
[07:26]2015国际邀请赛第二日TOP10集锦
2015/08/06 DOTA
Python中死锁的形成示例及死锁情况的防止
2016/06/14 Python
利用Python循环(包括while&for)各种打印九九乘法表的实例
2017/11/06 Python
python读csv文件时指定行为表头或无表头的方法
2019/06/26 Python
Python字符串中添加、插入特定字符的方法
2019/09/10 Python
python单向循环链表原理与实现方法示例
2019/12/03 Python
使用Django的JsonResponse返回数据的实现
2021/01/15 Python
css3制作彩色边线3d立体按钮的示例(css3按钮)
2014/05/06 HTML / CSS
html5调用摄像头功能的实现代码
2018/05/07 HTML / CSS
西班牙创意礼品和小工具网上商店:Curiosite
2016/07/26 全球购物
构建高效课堂实施方案
2014/03/13 职场文书
食品安全标语
2014/06/07 职场文书
孕妇离婚协议书范本
2014/11/20 职场文书
房产公证书格式
2015/01/26 职场文书
2015年度房地产工作总结
2015/04/09 职场文书
装饰施工员岗位职责
2015/04/11 职场文书
历史名人教你十五个读书方法,赶快Get起来!
2019/07/18 职场文书
Python办公自动化之教你用Python批量识别发票并录入到Excel表格中
2021/06/26 Python