美文网首页幻花创作小世界
解决input输入限制只能为数字或小数

解决input输入限制只能为数字或小数

作者: 小小少年小阿清 | 来源:发表于2019-11-22 10:25 被阅读0次
1.如何实现只能输入数字或小数
<input
                        id="maxAmount"
                        v-model="maxAmount"
                        type="number"
                        pattern="number"
                        placeholder="最大金额"
                        onkeyup="value=value.replace(/[^\d\.]/g,'')">

其中

value=value.replace(/[^\d.]/g,'')
[^\d.] 表示所有除了数字和小数点以外的字符
这个等式表示将所有其它字符都替换为空,只保留value中的数字和小数点

并且注意:pattern的浏览器支持情况如下


在这里插入图片描述
2.防止出现以0开头的整数情况
// 以上已经过滤,此处控制的是如果没有小数点,首位不能为类似于 01、02的金额
if (val !== '' && val.indexOf('.') === -1) { 
        val = parseFloat(val)
}

相关文章

网友评论

    本文标题:解决input输入限制只能为数字或小数

    本文链接:https://www.haomeiwen.com/subject/rzefwctx.html