el-input禁止输入特殊字符以及对输入框做其他限制

对Element的el-input禁止输入特殊字符，这里是禁止输入，而不是输入特殊字符后校验。

这里试用过 @keyup 和 @input.native，感觉都有点问题。

 <el-form  :model="userForm"  :rules="rules" ref="userRef" label-width="150px"><el-form-item label="姓名" prop="name"><el-input:value="userForm.name"@input="e => (userForm.name= noSpecialCode(e))"placeholder="请输入用户名（支持数字字母和汉字）"maxlength="25"></el-input></el-form-item><el-form-item label="账号" prop="accountNo"><el-input:value="userForm.accountNo"@input="e => (userForm.accountNo = noSpecialCode(e, 1))"maxlength="25"placeholder="请输入10-16位数字"></el-input></el-form-item>
</el-form>

针对不同类型的输入框可以自己定义相关正则，比如：

type1：只能输入数字
type2：只能输入大写字母和数字
default: 只能输入字母数字和汉字

methods: {noSpecialCode(e, type) {let pattern = "";switch (type) {case 1:pattern = /[\D]*/g;break;case 2:pattern = /[^A-Z\d]*/g;break;default:pattern = /[^0-9A-Za-z\u4e00-\u9fa5]*/g;break;}return e.replace(pattern, "");},
},

有更好的方法欢迎评论，一起学习呀！

el-input禁止输入特殊字符以及对输入框做其他限制相关推荐

input 禁止输入特殊字符
转自:https://blog.csdn.net/u010982856/article/details/52297232 有些特殊字符传入到后台是会产生错误的有可能会sql注入,所以从根本上拦截 ...
input禁止输入html转义字符,input 禁止输入特殊字符
方式一:拿到value值以后在你传递之前处理 function stripscript(value) { var pattern = new RegExp("[`~!@#$^&*( ...
html输入框限定字符,input框禁止输入特殊字符@#!$%^*()_+e
input框禁止输入特殊字符@#!$%^&*()_+e input type = number 我的解决方案: processSpelChar: function (){ var code; ...
input 输入值的监听禁止输入特殊字符
1.input 输入值的监听 //用于监听input的值变化(input的值产生变化才会触发事件)(function ($) {$.fn.watch = function (callback) {r ...
vue自定义指令---输入框禁止输入特殊字符
在输入框中经常要限制它的可输入范围,一般都是调用onChange事件,然后通过正则表达式来处理输入的内容,这样代码量比较大而且不好维护,所以我们需要自定义一个指令来解决这问题. 新建指令文件 impo ...
Vue指令-禁止输入特殊字符
介绍:无入侵的输入检测,感觉是比较优雅的解决问题关键点: 1.正则要写对,正则匹配的值需确认无误 2.重新触发双向绑定的方式 import Vue from 'vue' // 禁止输入特殊字符 Vu ...
html5 文本框限制,html中input禁止输入(禁止获得焦点)多种方法及input限制数字和长度...
input禁止输入(禁止获得焦点) 1: readonly规定输入字段为只读可复制,但是,用户可以使用Tab键切换到该字段,可选择,可以接收焦点,还可以选中或拷贝其文本. 2:disabled 被 ...
正则校验-禁止输入特殊字符和空格
后台管理输入框要求禁止输入特殊字符和空格 <el-input v-model="dataForm.username" :placeholder="$t('user. ...
ios，安卓 input禁止输入方式
input禁止输入只能输入数字.汉字.英文文本合成系统如 input method editor (即输入法编辑器)开始新的输入合成时会触发 compositionstart 事件当文本段落的组 ...

el-input禁止输入特殊字符以及对输入框做其他限制

对Element的el-input禁止输入特殊字符，这里是禁止输入，而不是输入特殊字符后校验。

针对不同类型的输入框可以自己定义相关正则，比如：

el-input禁止输入特殊字符以及对输入框做其他限制相关推荐

最新文章

热门文章