Javascript 为什么只有单击两次onclick才有效？

我在纯javascript中搜索autocomplete示例，在JSFIDLE上找到了一个非常好的示例，但它有一个Bug，我正试图找出如何修复它

只有在段落上单击两次时，“自动完成”才会自动完成文本

代码：

var db=[
“抽绳”，
“画圈”，
“drawCircleMore”，
“填充线”，
“填充圆”，
“fillCircleMore”
];
函数popupClearAndHide（）{
自动完成_result.innerHTML=“”；
autocomplete_result.style.display=“无”；
}
函数updPopup（）{
如果（！autocomplete.value）{
popupClearAndHide（）；
返回；
}
var a=新的RegExp（“^”+autocomplete.value，“i”）；
对于（var x=0，b=document.createDocumentFragment（），c=false；x
#自动完成{
边框：1px纯银；
大纲：无；
保证金：0；
背景：#fff；
}
#自动完成结果{
边框：1px纯银；
边界顶部：0；
位置：绝对位置；
溢出：自动；
最大高度：93px；
背景：#fff；
}
#自动完成，
#自动完成结果{
宽度：200px；
框大小：边框框；
}
#自动完成，
#自动完成结果{
填充：4px；
保证金：0；
颜色：#000；
}
#自动完成结果p:n个子项（2n+1）{
背景：#f6f6f6；
}
#自动完成结果p：悬停{
背景：#e5；
}

On change事件在单击事件能够完成之前触发
删除更改呼叫将解决此问题。“imvain2”在下面的评论中建议用“输入”事件监听器替换“keyup”事件监听器。这将触发任何输入，而不仅仅是“键控”

演示：
autocomplete.addEventListener（“输入”，updPopup）；
自动完成。addEventListener（“焦点”，updPopup）；
它不能解决问题，但我建议您将自动完成代码放入函数中，然后使用
d.addEventListener（“单击”，插入完成）我将对你的答案发表评论，而不是添加我自己的答案。我想输入中添加了
change
，以检查是否有未键入的内容被更改。您可以将
keyup
替换为
input
，它将正常工作。