js中可不可以设置 当键盘事件触发时,鼠标事件失效?

发布于 2022-09-05 10:05:11 字数 777 浏览 15 评论 0

下拉链接图片

详情:
有这么一个网页, 可以键盘up和down来切换 选中行,也可以使用鼠标来选择。
但是当我鼠标在页面上时,如果再使用键盘,down到最后一行,我默认事件是当最后一行时,选中调回第一条,
但是由于鼠标在页面上,跳到第一条的过程在,会触发 onmouseenter事件,导致直接跳到了我鼠标在的那一行,有没有什么办法 解决一下?

问题: 鼠标在页面时,页面下拉框(ul-li)改变触发 onmouseover,如何禁止,或修改?

自问自答一下, 免得有兄弟遇到同样的问题

我增加了一个判断和定时器,由于是使用react,所以直接用state来实现,大致

disableMouseOverAWhile = () => {
    this.setState({
      mouseover: false
    });

    this.timer && clearTimeout(this.timer);
    this.timer = setTimeout(() => {
      this.setState({mouseover: true});
    }, 123)
  }

键盘事件时,顺便触发这个。
然后 鼠标移动事件先判断this.state.mouseover值,再选择是否触发。

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

半衬遮猫 2022-09-12 10:05:11

$.off 就取消事件了。

如果只是针对你说的情况,跳第一条前取消,跳完之后再绑定。当然,你说的这个效果的实现,要想“完美”,确实是有很多细节要处理的。

雪落纷纷 2022-09-12 10:05:11

提供一个思路

键盘操作时设定一个 boolean 变量表示 keyboard mode,这时要么解绑鼠标事件、要么在鼠标事件里判断 keyboard mode 则不干事。

然后同时设一个 timeout 在一定时间里取消 keyboard mode,比如一秒

瞳孔里扚悲伤 2022-09-12 10:05:11

触发事件的时候移除另外一个事件就ok

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文