限制el-input可输入字符

无名氏zzz

已于 2024-08-20 14:29:07 修改

阅读量331

点赞数 3

文章标签： vue.js elementui

于 2024-08-07 11:59:22 首次发布

本文链接：https://blog.csdn.net/m0_46714106/article/details/140988102

版权

1. 文本输入框，支持输入大小写字母和数字，最长不超过18个字符

        <el-input
          oninput="value=value.replace(/[^\w_]/g,'')"
          maxlength="18"
          v-model.trim="searchInfo.param1"
          placeholder="XXX"
          clearable
        ></el-input>

2. 数字型输入框，只允许输入数字，最长不超过10个字符

        <el-input
          oninput="value=value.replace(/[^\d]/g,'')"
          maxlength="10"
          v-model.trim="searchInfo.param2"
          placeholder="XXX"
          clearable
        ></el-input>

3. 文本输入框，允许输入中文字符、大小写英文以及数字，最长不超过20个字符


        <el-input
          @input="checkInput"
          maxlength='20'
          v-model.trim="searchInfo.param3"
          placeholder="XXX"
          clearable
        ></el-input>

// 限制输入为中文/大小写字母/或数字
checkInput(event) {
  const regex = /^[\u4e00-\u9fa5a-zA-Z0-9]+$/;
  if (!regex.test(event)) {
    this.searchInfo.param3 = event.slice(0, -1);
  }
},