代码之家  ›  专栏  ›  技术社区  ›  jcubic

如何在JavaScript中截取链接上的回车键?

  •  1
  • jcubic  · 技术社区  · 3 年前

    有没有一种方法可以在不使用Bookmarklet的情况下拦截链接上的回车键( href="javascript:..." )?

    我试着这样做:

    addEventListener('keypress', (e) => {
      console.log(e);
      if (e.charCode == 13) {
        alert('x');
      }
    });
    <a href="#">this is link</a>

    如果按下选项卡并输入,则不会触发代码。只有当链接不在焦点上时,才会触发警报。有没有一种方法可以在通过链接按下回车键时触发JavaScript?或者是 href 唯一的办法?应该有一种使用JavaScript的方法,而不必将JavaScript放入页面上的每个链接中。

    如果你问我为什么需要这个,那是因为这个问题: how to open a file upload dialog box when a hyperlink is clicked ,我想更新我的答案,看看是否可以触发点击 input[type="file"] 按下回车键时。

    1 回复  |  直到 3 年前
        1
  •  3
  •   Brother58697    3 年前

    如果希望处理程序仅在链接集中时触发,请将侦听器添加到元素本身。

    要获得更一致的键盘事件处理,请收听 keydown 而不是 keypress which has been deprecated .

    要拦截enter打开链接的默认操作,请使用 event.preventDefault()

    最后,避免使用charcode或keycode,使用 key 相反,这在不同的键盘布局之间更一致。

    link.addEventListener('keydown', (e) => {
      const { key } = e
      console.log(key);
      if (key === 'Enter') {
        e.preventDefault();
        alert('You just tried opening Google');
      }
    });
    <a id="link" href="https://www.google.com">Google</a>