js限制input输入文本2个字符英文1个字符
<input type="text" v-model="comodMark" @input="changeValue" />
changeValue (el) {
let value = el.target.value
// 最长4个字符 (需求限制4个字符)
if (value.length > 4) {
value = value.substring(0, 4)
}
let enLength = 0
let cnLength = 0 // 中文个数
let len = value.length
let charCode = -1
let valArr = value.split('')
// 中文、中文标点、全角字符按1长度,英文、英文符号、数字按0.5长度计算
let cnReg = /([\u4e00-\u9fa5]|[\u3000-\u303F]|[\uFF00-\uFF60])/
// 正则这个地方有个小坑, 如果带着g全局匹配 会出现一次true 一次false的问题,原因下面我放链接
let valLen = valArr.length
// 判断记录是中文还是非中文
// for (var i = 0; i < len; i++) {
// charCode = value.charCodeAt(i)
// if (charCode >= 0 && charCode <= 128) {
// enLength += 1
// } else {
// cnLength += 2
// }
// }
// 用正则性能要好一点
for (var i = 0; i < len; i++) {
if (!cnReg.test(value[i])) {
enLength += 1
} else {
cnLength += 2
}
}
// 两个中文
if (cnLength >= 4) {
// 前2个都是中文
if (valLen >= 3) {
if (cnReg.test(valArr[0]) && cnReg.test(valArr[1]) && !cnReg.test(valArr[2])) {
// console.log('前两个都是中文1111111111111', value, '截取0-2')
this.comodMark = value.substring(0, 2)
// 前三个都是中文
} else if (cnReg.test(valArr[0]) && cnReg.test(valArr[1]) && cnReg.test(valArr[2])) {
// console.log('前三个都是中文2222222222222', value, '截取0-2')
this.comodMark = value.substring(0, 2)
// 前1个中文 两个英文
} else if (cnReg.test(valArr[0]) && !cnReg.test(valArr[1]) && !cnReg.test(valArr[2])) {
// console.log('前1个中文 两个英文', value, '截取0-3')
this.comodMark = value.substring(0, 3)
// 前两个英文
} else if (!cnReg.test(valArr[0]) && !cnReg.test(valArr[1]) && cnReg.test(valArr[2])) {
// console.log('前两个英文3333333333333333', value, '截取0-3')
this.comodMark = value.substring(0, 3)
} else {
// console.log('else')
this.comodMark = value.substring(0, 2)
}
} else {
this.comodMark = value.substring(0, 2)
}
// 1个中文 两个英文
} else if (cnLength === 2 && enLength >= 2) {
// console.log('1个中文 两个英文')
this.comodMark = value.substring(0, 3)
// 无中文
} else if (cnLength === 0) {
// console.log('无中文')
this.comodMark = value.substring(0, 4)
}
},
适用我这种仅输入几个限制的,如果多的话感觉不适用.也没找到更合适的方法,所以直接截取长度个数
如果有好的方法欢迎留言,不吝赐教!!
当然更希望路过的大神, 提些建议, 如何优化,灵活些,给些思路也可~