当前位置: 移动技术网 > IT编程>开发语言>JavaScript > vue+element项目中过滤输入框特殊字符小结

vue+element项目中过滤输入框特殊字符小结

2019年08月06日  | 移动技术网IT编程  | 我要评论

可以在main.js中写入方法

 

vue.prototype.validse = function (value, number = 255) {
value = value.replace(/[`~*~!@#$%^&*()_\-+=<>?:"{}|,./;'\\[\]·~!@#¥%……&*()——\-+={}|《》?:“”【】、;‘’,。、]/g, '').replace(/\s/g, "");
if (value.length >= number) {
this.$message({
type: "warning",
message: `输入内容不能超过${number}个字符`
});
}
return value;
};

 

html部分

<el-input maxlength='15' :value="searchform.logid" @input='e => searchform.logid = validse (e,15)' placeholder="请输入日志id"></el-input>

需要将v-model拆分为:value@input

通过以上方法又扩展出以下方法

 

//只能输汉字
vue.prototype.chineseonly = function (value) {
value = value.replace(/[^\u4e00-\u9fa5]/g, '');
return value
};
//只能输正整数
vue.prototype.idonly = function (value) {
value = value.replace(/[^0-9]/g, '');
return value
};
//不允许输汉字
vue.prototype.nochineseonly = function (value) {
value = value.replace(/[\u4e00-\u9fa5]/g, '');
return value
};

 

//逗号和数字
vue.prototype.programidonly = function (value) {
value = value.replace(/[^0-9,]/g, '');
return value
};
//数字和回车
vue.prototype.idsonly = function (value) {
value = value.replace(/[^\r\n0-9]/g, '');
return value
};
//数值大小限定
vue.prototype.numberlimit = function (value) {
value = value.replace(/[^0-9]/g, '');
if (value >= 2147483647) {
this.$message({
type: "warning",
message: `最大可输入值为2147483647`
});
}
return value
};
// 正整数
vue.prototype.onlypositiveinteger = function (value) {
value = string(value).match(/[1-9]\d*/g, "")
return value === null ? '' : number(value[0])
};
// 正整数(包含0)
vue.prototype.onlypositiveinteger1 = function (value) {
console.log(typeof (value));

value = string(value).match(/[1-9]\d*|0/g, "")
return value === null ? '' : number(value[0])
};
// 负整数
vue.prototype.onlynegativeinteger = function (value) {
value = string(value).match(/^-[1-9]*\d*/g, "")
return value === null ? '' : value[0] === '-' ? '-' : value[0] === '-0' ? '' : number(value[0])
};
// 负整数(包含0)
vue.prototype.onlynegativeinteger1 = function (value) {
value = string(value).match(/^-[1-9]*\d*|0/g, "")
return value === null ? '' : value[0] === '-' ? '-' : number(value[0])
};
// 整数
vue.prototype.onlyinteger = function (value) {
value = string(value).match(/^-?[1-9]*\d*|0/g, '')
return value === null ? '' : value[0] === '-' ? '-' : value[0] === '' ? '' : number(value[0])
};
// 整数区间
vue.prototype.onlysection = function (value, min, max) {
if (min < 0) {
value = string(value).match(/-?[1-9]*\d*/g, "")
} else {
value = string(value).match(/[1-9]*\d*/g, "")
}
// value = string(value).match(/-?[1-9]*\d*/g, "")
value = value === null ? '' : value[0] === '-' ? '-' : value[0] === '' ? '' : number(value[0])
if (value < min) {
return min
} else if (value > max) {
return max
} else {
return value
}
};

 

如对本文有疑问, 点击进行留言回复!!

相关文章:

验证码:
移动技术网