vue表单校验限制输入数字后小数点两位(包括避开通过中文输入法的那些坑)

复制代码
<el-form-item label="海运运费系数">
              <el-input
                v-model.trim="ruleForm.oceanFreightCoefficient"
                maxlength="8"
                @keyup.native="ruleForm.oceanFreightCoefficient=oninput(ruleForm.oceanFreightCoefficient)"
                @change="ruleForm.oceanFreightCoefficient=oninput(ruleForm.oceanFreightCoefficient)"
              ></el-input>&nbsp;&nbsp;
              <span>元/千克</span>
</el-form-item>
复制代码
复制代码
oninput(num) {
          console.log(num)
            var str = num
            var len1 = str.substr(0, 1)
            var len2 = str.substr(1, 1)
            var lenLast=str.substr(str.length-1)
            //如果第一位是0,第二位不是点,就用数字把点替换掉
            if (str.length > 1 && len1 == 0 && len2 != ".") {
                str = str.substr(1, 1)
            }
            //第一位不能是.
            if (len1 == ".") {
                str = ""
            }
            //最后一位不能是.
            if (str.length==8&&lenLast == ".") {
                str = ""
            }
            //限制只能输入一个小数点
            if (str.indexOf(".") != -1) {
                var str_ = str.substr(str.indexOf(".") + 1)
                if (str_.indexOf(".") != -1) {
                    str = str.substr(0, str.indexOf(".") + str_.indexOf(".") + 1)
                }
            }
            //正则替换
            str = str.replace(/[^\d^\.]+/g, '') // 保留数字和小数点
            str = str.replace(/\.\d\d\d$/,'') // 小数点后只能输两位
            return str
}
复制代码

 

posted @   陪伴者  阅读(6875)  评论(0编辑  收藏  举报
编辑推荐:
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
阅读排行:
· Manus爆火,是硬核还是营销?
· 终于写完轮子一部分:tcp代理 了,记录一下
· 别再用vector<bool>了!Google高级工程师:这可能是STL最大的设计失误
· 单元测试从入门到精通
· 震惊!C++程序真的从main开始吗?99%的程序员都答错了
点击右上角即可分享
微信分享提示