Welcome to ShenZhenJia Knowledge Sharing Community for programmer and developer-Open, Learning and Share
menu search
person
Welcome To Ask or Share your Answers For Others

Categories

功能:做一个菜单加输入框,用于搜索菜单内容,显示匹配选项,非匹配隐藏,点击匹配选项,进入后续点击事件处理。

$('.keywordQuery').on('change keyup', function(e){...}

出现现象:输入文字后显示匹配选项,但是点击匹配选项第一次,点击事件不执行,第二次以及之后正常进入点击事件。或者先点击其他元素/点击控制台/浏览器切后台再切前台,之后再点击匹配选项才能正常进入点击事件。

检查点击事件没有问题,以为是焦点问题,焦点定位到其他元素或者直接让一个元素执行点击事件都没有效果。怀疑时间冒泡和时间委托问题,修改一轮没有效果。代码增加document.on('click', function(e){console.log(e.target)})查看是否点击到了目标元素,发现没有。

后来把代码改成
$('.keywordQuery').on('input keyup', function(e){...(用于筛选匹配选项)}
正常运行。想不通,筛选匹配选项的方法正常执行。change要失焦才改变值,我只是显隐选项,跟值是否改变无关吧?

问题:元素确实存在于document中,监听的点击事件没有问题,然而点击不触发点击事件,是什么原因


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
thumb_up_alt 0 like thumb_down_alt 0 dislike
316 views
Welcome To Ask or Share your Answers For Others

1 Answer

虽然描述的很仔细,但还是木有明白你想表达的意思

一图胜千言万语,直接贴个在线示例代码吧


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
thumb_up_alt 0 like thumb_down_alt 0 dislike
Welcome to ShenZhenJia Knowledge Sharing Community for programmer and developer-Open, Learning and Share
...