如何避免输入中文拼音时触发input事件?

367 阅读1分钟

如何避免输入中文拼音时触发input事件

<!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="inp" />
    <script>
        let inp=document.getElementById('inp')
        let isComposite=false
        function search(){
            console.log('搜索'+inp.value)
        }
        inp.addEventListener('input',()=>{
            if(!isComposite){
                console.log('input')
                search()
            }
            
        })

        inp.addEventListener('compositionstart',function(){
            console.log('start')
            isComposite=true
        })
        inp.addEventListener('compositionend',function(){
            console.log('end')
            isComposite=true
            search()
        })
    </script>
</body>
</html>