原生js过滤删除用户输入input输入框的全角文本功能demo实现

最新推荐文章于 2022-11-24 19:30:19 发布

怒放的生命1991

最新推荐文章于 2022-11-24 19:30:19 发布

阅读量244

点赞数

分类专栏： js原生前端文章标签：前端 javascript html 原生js

本文链接：https://blog.csdn.net/qq_34507902/article/details/127656802

版权

前端同时被 2 个专栏收录

29 篇文章 0 订阅

订阅专栏

js原生

6 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <input type="text" id="aaaa">
  <button onclick="inputTextFilterObj.stopFullAngleRuleInputFn('#aaaa')">取消监听过滤全角</button>
  <button onclick="inputTextFilterObj.setFullAngleRuleInputFn('#aaaa')">开始监听过滤全角</button>
</body>
</html>
<script>
let inputTextFilterObj = {
    // 调用监听函数
    setFullAngleRuleInputFn(tag) {
        let setRegFn=this.setRegFn;
        document.querySelectorAll(tag).forEach(function (item) {
            item.addEventListener('keyup', setRegFn);//键盘抬起
            item.addEventListener('beforepaste', setRegFn);//在用户执行粘贴工作之前，进行的js操作
        })
    },
    // 移除监听函数
    stopFullAngleRuleInputFn(tag) {
        let setRegFn=this.setRegFn;
        document.querySelectorAll(tag).forEach(function (item) {
            item.removeEventListener('keyup', setRegFn);
            item.removeEventListener('beforepaste', setRegFn);
        })
    },
    //设置监听的函数
    setRegFn(item) {
        let value = item.target.value;
        item.target.value = value.replace(/[\uFF00-\uFFFF]/g, '');
        if (!item.clipboardData) {
            return
        }
        let value1 = item.clipboardData.setData('text', clipboardData.getData('text').replace(reg, ''));
        item.value = value1.replace(/[\uFF00-\uFFFF]/g, '')
    }
}
inputTextFilterObj.setFullAngleRuleInputFn('#aaaa');
</script>