click和blur事件冲突解决方案
场景:例如做一个模仿百度搜索的搜索框,输入文字下面会有匹配项,当点击下拉项中的值时,就将值添加到搜索框中同时隐藏下拉框,点击其他地方就直接隐藏下拉框,这时所需要的事件分别为 下拉框事件onclick,输入框事件onblur,但是实际会出现想选中下拉框却先触发了onblur事件导致onclick无法执行。原因是因为JS是单线程,同一时间只能处理一个事件,且blur执行顺序优先click.
解决方案:将onclick改为onmousedown即可。
场景:例如做一个模仿百度搜索的搜索框,输入文字下面会有匹配项,当点击下拉项中的值时,就将值添加到搜索框中同时隐藏下拉框,点击其他地方就直接隐藏下拉框,这时所需要的事件分别为 下拉框事件onclick,输入框事件onblur,但是实际会出现想选中下拉框却先触发了onblur事件导致onclick无法执行。原因是因为JS是单线程,同一时间只能处理一个事件,且blur执行顺序优先click.
解决方案:将onclick改为onmousedown即可。
【推荐】还在用 ECharts 开发大屏?试试这款永久免费的开源 BI 工具!
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步