【学生笔记】input框实时禁止输入特殊字符compositionstart 中文输入法输入开始时触发。 composi

直接上代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div class="container">
        用户名：<input type="text" name="name" id="name" >
        <input >
    </div>

    <script>
        var input = document.getElementById('name')
        let typing = false
        input.addEventListener('compositionstart', function () {
            typing = true
        })
        input.addEventListener('compositionend', function () {
            typing = false
        })
        input.addEventListener('keyup', function () {
            if (!typing) {
                this.value = this.value.replace(/[^a-z0-9\u4E00-\u9FA5]/g,'')
            }
        })
    </script>
</body>
</html>

compositionstart 中文输入法输入开始时触发。
compositionend 中文输入法输入结束时触发。
keyup 用户释放键盘按键时触发。