<!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>输入中文按下空格前不进行搜索</title>
</head>
<body>
搜索:<input type="text">
</body>
<script>
var inp = document.querySelector('input');
// 是否正在合成
let isComosite = false;
// 搜索事件
function search(){
console.log('搜索内容:' + inp.value);
}
// 输入触发搜索事件
inp.addEventListener('input',function(){
if(!isComosite){ // 只有没有在合成的时候才触犯搜索
console.log('input');
search();
}
})
// 合成开始事件
inp.addEventListener('compositionstart',function(){
console.log('start');
isComosite = true; // 开始合成
})
// 合成结束事件
inp.addEventListener('compositionend',function(){
console.log('end');
isComosite = false; // 合成结束
search();
})
</script>
</html>