微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

elementUI el-input 只能输入正整数验证的操作方法

字母e在js中属于数字,但是正则匹配 \d 是拦不住字母e 的

正确写法为:

onKeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode || event.which))) || event.which === 8"
<el-input type="number" placeholder="请输入" min="1" onKeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode || event.which))) || event.which === 8" v-model.number="count"></el-input>

其他写法: 

// 只允许输入数字

<el-input type="number" placeholder="请输入" min="1" oninput ="value=value.replace(/[^\d]/g,'')"  v-model.number="count"></el-input>

同理,只允许输入数字和小数

oninput ="value=value.replace(/[^0-9.]/g,'')"

允许输入小数点后几位:

// 保留一位小数
oninput="if(isNaN(value)) { value = parseFloat(value) } if(value.indexOf('.')>0){value=value.slice(0,value.indexOf('.')+2)}" 
 
// 若需要保留n位小数,则把2 改为 1 + n即可

设置范围,最大值,最小值,监听input 及 change事件

<el-input min="0" max="100" type="number" @input="numberChange($event,100)" @change="numberChange($event,100)" onKeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode || event.which))) || event.which === 8" v-model.number="count"></el-input> 
numberChange (val,max) {
      this.$nextTick(() => {
        this.count = Math.min(parseInt(val),max)
      })
    }

<el-input >正数校验 小数校验

1.正数,不能输入小数和小数点,只能输入 正整数,大于0的

<el-form-item label="安全库存:" prop="safeQty" class="meter_one" style="margin-top: 10px">
          <el-input
            v-model="form.safeQty"
            type="number"
            min="0"
            @input="form.safeQty=form.safeQty.replace(/^(0+)|[^\d]+/g,'')"
            placeholder="请输入安全库存"/>
        </el-form-item>

2.小数点保留4位

 <el-form-item label="净重KG:" prop="netWeight" class="meter_one" style="margin-top: 10px">
          <el-input
            v-model="form.netWeight"
            type="number"
            placeholder="请输入净重KG"
            oninput="if(isNaN(value)) { value = null } if(value.indexOf('.')>0){value=value.slice(0,value.indexOf('.')+5)}"
          />
        </el-form-item>

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐