elementui之el-input输⼊框内容限制elementui之el-input输⼊框内容限制汇总
elementui之el-input输⼊框内容限制
限制仅能输⼊数字，整数不得超过2位，⼩数不得超过2位
<template>
<div class="content-box">
<div class="container">
<div>输⼊框限制数字，限制整数不得超过2位，⼩数不得超过2位</div>
<el-input
placeholder="请输⼊该内容分值"
@input="limitIptNumber()"
></el-input>
{{ iptNum3 }}
</div>
</div>
</template>
<script>
export default{
name:'record',
components:{},
props:{},
data(){
return{
iptNum3:"",
}
},
created(){
console.log('created-record')
},
activated(){
console.log('activated-record')
},
deactivated(){
console.log('deactivated-record')
},
methods:{
limitIptNumber(){
var str =this.iptNum3
var len1 = str.substr(0,1)
var len2 = str.substr(1,1)
var len3 = str.substr(2,1)
// 整数为两位后⾯限制输⼊清空
if(len1 !=0&& len3 !==''&& len3 !=='.'){
this.iptNum3 = str.substr(0,2)
return
}
// 如果第⼀位是0，第⼆位不是点，就⽤数字把点替换掉
if(str.length >1&& len1 ==0&& len2 !="."){
str = str.substr(1,1)
}
// 限制只能输⼊⼀个⼩数点
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.substr(0, str.indexOf(".")+ str_.indexOf(".")+1)input框禁止输入
}
}
// 正则替换限制输⼊框⼩数点位数，多出的过滤掉
str = place(/[^\d^\.]+/g,'')// 保留数字和⼩数点
str = place(/^\D*([0-9]\d*\.?\d{0,2})?.*$/,'$1')// ⼩数点后只能输 2 位this.iptNum3 = str
}
}
}
</script>
<style  lang="scss" scoped>
</style>
效果如下
限制输⼊数字1到3位数字（0-100）
<el-input
v-model.number="checkForm.submit"
maxlength=3
minlength=1
placeholder="请输⼊"
@input="v => checkForm.submit = v.replace(/[^\d]/g,'')"
></el-input>
限制仅能输⼊数字和逗号
<div class="content-box">
<div class="container">
<div>输⼊框限制数字，限制整数不得超过2位，⼩数不得超过2位</div>
<el-input
placeholder="请输⼊该内容分值"
@input="limitIptNumber()"
></el-input>
{{ iptNum3 }}
</div>
</div>
</template>
<script>
export default{
name:'record',
components:{},
props:{},
data(){
return{
iptNum3:"",
}
},
created(){
console.log('created-record')
},
activated(){
console.log('activated-record')
},
deactivated(){
console.log('deactivated-record')
},
methods:{
limitIptNumber(){
var str =this.iptNum3
// 正则替换限制输⼊框数字和英⽂⼩数点，多出的过滤掉
str = place(/[^\d^\,]+/g,'')// 保留数字和逗号
this.iptNum3 = str
}
}
}
</script>
<style  lang="scss" scoped>
</style>
限制仅能输⼊数字和字母，汉字不可以
<el-input
v-model="checkForm.projectCode"
placeholder="请输⼊项⽬编号"
@input="checkForm.projectCode = place(/[^\w\\]/g,'')" ></el-input>
限制仅能输⼊数字和字母和英⽂逗号，汉字不可以
v-model="checkForm.projectCode"
placeholder="请输⼊项⽬编号"
@input="checkForm.projectCode = place(/[^\w\,]/g,'')" ></el-input>
持续更新中…

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。