资讯专栏INFORMATION COLUMN

input限制输入小数点后两位(vue版本)

NSFish / 474人阅读

摘要:抛砖引玉上代码首先想到在事件中正则匹配一下,但是,在输入错误格式或非数字的情况下,会将整个输入框清空,体验很不好限制小数点后两位然后我就加了一个字段,在事件中赋值,然后匹配限制小数点后两位这样已经可以实现需求了,不过体验上还是有一点怪,

抛砖引玉——上代码
首先想到在input事件中正则匹配一下,但是,在输入错误格式或非数字的情况下,会将整个输入框清空,体验很不好:

然后我就加了一个字段,在keyup事件中赋值,然后匹配:

这样已经可以实现需求了,不过体验上还是有一点怪,在输入不匹配时光标会闪动,最佳的体验应该是在keyup中将不匹配的按键直接return,不过这样需要额外判断一下backspace、delete、——>、<——等,不知各位大佬是怎么实现的,欢迎评论!!
附:关于input的都可以交流呀

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/93423.html

相关文章

  • 代码片段之jQuery控制input只能输入数字和两位小数

    摘要:前言做为一个,难免会遇到那种表单中限制输入的问题,比如,限制空格的输入,只允许输入数字,以及小数点的控制等等,这里,我们就说一下数字的限制。 showImg(https://segmentfault.com/img/remote/1460000019199762?w=1350&h=900); 前言 做为一个PHPER,难免会遇到那种表单中jQuery限制输入的问题,比如,限制空格的输入...

    iOS122 评论0 收藏0
  • 代码片段之jQuery控制input只能输入数字和两位小数

    摘要:前言做为一个,难免会遇到那种表单中限制输入的问题,比如,限制空格的输入,只允许输入数字,以及小数点的控制等等,这里,我们就说一下数字的限制。 showImg(https://segmentfault.com/img/remote/1460000019199762?w=1350&h=900); 前言 做为一个PHPER,难免会遇到那种表单中jQuery限制输入的问题,比如,限制空格的输入...

    MingjunYang 评论0 收藏0
  • 第十集: 从零开始实现一套pc端vue的ui组件库( 计数器组件 )

    摘要:第十集从零开始实现计数器组件本集定位听到计数器这个名字很多人是不是一瞬间没有什么印象毕竟这个组件用的比较少就是那种左边一个右边一个控制某些数量的时候才会用到比如我之前做的商城小程序只有下单页面的规格弹出框里面才有他的身影如果是涉及到处理商 第十集: 从零开始实现( 计数器组件 ) 本集定位: 听到计数器这个名字很多人是不是一瞬间没有什么印象, 毕竟这个组件用的比较少,就是那种左边...

    Sanchi 评论0 收藏0
  • 第十集: 从零开始实现一套pc端vue的ui组件库( 计数器组件 )

    摘要:第十集从零开始实现计数器组件本集定位听到计数器这个名字很多人是不是一瞬间没有什么印象毕竟这个组件用的比较少就是那种左边一个右边一个控制某些数量的时候才会用到比如我之前做的商城小程序只有下单页面的规格弹出框里面才有他的身影如果是涉及到处理商 第十集: 从零开始实现( 计数器组件 ) 本集定位: 听到计数器这个名字很多人是不是一瞬间没有什么印象, 毕竟这个组件用的比较少,就是那种左边...

    Kerr1Gan 评论0 收藏0
  • 2. Python中的基本输入、输出、格式化输出

    摘要:本文利用的是版本,建议学习版本中的基本输入输出格式化输出输入使用读取一行,将其转换为类型并返回,的参数可有可无,如果有参数的话,会在控制台可以这样理解输出参数的内容,不换行。 本文利用的是Python 3.x版本,建议学习3.x版本 Python中的基本输入、输出、格式化输出 1. 输入 使用input([prompt])读取一行,将其转换为string类型并返回,input的参数可有...

    mudiyouyou 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<