单行 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 相关文章推荐
jquery validate poshytip 自定义样式
Nov 26 Javascript
js获取数组的最后一个元素
Apr 14 Javascript
JQuery选中checkbox方法代码实例(全选、反选、全不选)
Apr 27 Javascript
jQuery+PHP+MySQL二级联动下拉菜单实例讲解
Oct 27 Javascript
用v-html解决Vue.js渲染中html标签不被解析的问题
Dec 14 Javascript
jQuery图片缩放插件smartZoom使用实例详解
Aug 25 jQuery
全面解析vue router 基本使用(动态路由,嵌套路由)
Sep 02 Javascript
解决JQuery的ajax函数执行失败alert函数弹框一闪而过问题
Apr 10 jQuery
微信小程序实现收货地址左滑删除
Nov 18 Javascript
微信小程序实现侧边分类栏
Oct 21 Javascript
微信小程序如何获取地址
Dec 24 Javascript
js实现简单的贪吃蛇游戏
Apr 23 Javascript
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创建PowerPoint2007文档的方法
2015/12/10 PHP
用JavaScript隐藏控件的方法
2009/09/21 Javascript
javascript jscroll模拟html元素滚动条
2012/12/18 Javascript
JavaScript加强之自定义event事件
2013/09/21 Javascript
jQuery绑定事件不执行但alert后可以正常执行
2014/06/03 Javascript
网页右下角弹出窗体实现代码
2014/06/05 Javascript
详解JavaScript正则表达式中的global属性的使用
2015/06/16 Javascript
jQuery实现的背景动态变化导航菜单效果
2015/08/24 Javascript
Javascript表单特效之十大常用原理性样例代码大总结
2016/07/12 Javascript
javascript匀速动画和缓冲动画详解
2016/10/20 Javascript
NodeJs模拟登陆正方教务
2017/04/28 NodeJs
JavaScript基本语法_动力节点Java学院整理
2017/06/26 Javascript
Node.js+Express+MySql实现用户登录注册功能
2017/07/10 Javascript
vue单页应用中如何使用jquery的方法示例
2017/07/27 jQuery
Vue实现web分页组件详解
2017/11/28 Javascript
详解VueJS应用中管理用户权限
2018/02/02 Javascript
如何用Node写页面爬虫的工具集
2018/10/26 Javascript
详解vite2.0配置学习(typescript版本)
2021/02/25 Javascript
[32:26]EG vs IG 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
用python + hadoop streaming 分布式编程(一) -- 原理介绍,样例程序与本地调试
2014/07/14 Python
python里使用正则的findall函数的实例详解
2017/10/19 Python
Python爬虫实现全国失信被执行人名单查询功能示例
2018/05/03 Python
Pandas库之DataFrame使用的学习笔记
2019/06/21 Python
简单了解python gevent 协程使用及作用
2019/07/22 Python
解决PDF 转图片时丢文字的一种可能方式
2021/03/04 Python
Yahoo的PHP面试题
2014/05/26 面试题
营销总经理的岗位职责
2013/12/15 职场文书
实习生求职自荐信
2014/02/07 职场文书
学校师德师风自我剖析材料
2014/09/29 职场文书
2014年会计个人工作总结
2014/11/24 职场文书
监守自盗观后感
2015/06/10 职场文书
导游词之无锡东林书院
2019/12/11 职场文书
使用GO语言实现Mysql数据库CURD的简单示例
2021/08/07 Golang
Redis实战高并发之扣减库存项目
2022/04/14 Redis
JS class语法糖的深入剖析
2022/07/07 Javascript
详解Golang如何实现支持随机删除元素的堆
2022/09/23 Python