el-input 输入框禁止输入特殊字符

吴小花的博客

于 2021-10-26 10:14:54 发布

阅读量3.3k

点赞数 1

分类专栏： Vue.js 项目实战经验文章标签： elementui

原文链接：https://www.jianshu.com/p/41a9b68c8011

版权

Vue.js 项目实战经验专栏收录该内容

52 篇文章 ¥19.90 ¥99.00

订阅专栏

超级会员免费看

本文介绍如何在使用Element UI的el-input组件时，限制用户输入特殊字符，确保输入内容的规范性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<template>
    <el-input
        v-model="value"
        placeholder="请输入"
        @keyup.native="keyUp"
        @keydown.native="keydown"
     ></el-input>
</template>
<script>
  export default {
      methods:{
      //限制输入特殊字符
        keyUp(e) {
           e.target.value = e.target.value.replace(/[`~!@#$%^&*()_\-+=<>?:"{}|,.\/;'\\[\]·~！@#￥%……&*（）——\-+={}|《》？：“”【】、；‘’，。、]/g,"");
          },
           // 只能输入汉字、英文、数字
        keydown(e) {
           e.target.value = e.target.value.replace(/[^\a-\z\A-\Z0-9\u4E00-\u9FA5]/g,"");
          }
    }
}
</script>