今天写小程序时,有个充值功能,需要输入充值金额,我看了下支付宝的水电表缴费交互效果,发现调启数字键盘后“输入0后第二位则不能为0,只能为小数点”“第一位不能输入小数点”“保留两位小数”“同时也只能输入数字与小数点(在非数字键盘的情况下)”,看到这兴趣就来了,肯定得搞起来。
代码如下
// 调启数字键盘输入事件 valChange(val) { this.amount += val; // 只能输入"数字"和"." this.amount = this.amount.replace(/[^\d.]/g, ''); // 第一位字符不能为"." this.amount = this.amount.replace(/^\./g, ''); // 只能输入一个小数点且只保留一个 this.amount = this.amount.replace('.', '$#$').replace(/\./g, '').replace('$#$', '.'); // 只能输入两位小数 this.amount = this.amount.replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3'); // 如果第一位为"0",第二位必须为".",否则替换 this.amount = this.amount.replace(/^0(?!\.|$)(.*)/, '$1'); }
如上,由于我用的uview的数字键盘,每次触发点击都会返回当前点击的数字或小数点,然后自行拼接,那么就在拼接后,使用正则的方式将其按照需求过滤掉即可。
上方代码我没进行动态封装,代码可自行复制后封装,通过动态传值来实现公用。
本文链接:https://my.lmcjl.com/post/19746.html
展开阅读全文
4 评论