不再可以通过Tab键访问div内的锚点链接

Question

我正在研究A11y问题我正在研究的项目。

我们有一个upvotes div，当用户将鼠标悬停在其上时（使用鼠标）或专注于它（使用tab键）如果表示用户不是登录了。

发生这种情况时，会显示signup/signin div，其中包含2个锚点链接，提示用户注册或登录。

这是我们最初的代码（在CoffeeScript上）：

hoverize: (votes) ->
  $(document).on {
    'mouseenter focus': ->
      $("div.participation-not-allowed", this).show()
      $("div.participation-allowed", this).hide()
    mouseleave: ->
      $("div.participation-not-allowed", this).hide()
      $("div.participation-allowed", this).show()
  }, votes

此代码的问题在于，如果用户使用tab键移动网站，signup/signin div将保持关注状态，并且在用户将其悬停在其上之前不会隐藏鼠标。

我们已修复此blur添加mouseleave函数，它为我们提供了以下代码：

hoverize: (votes) ->
  $(document).on {
    "mouseenter focus": ->
      $("div.participation-not-allowed", this).show()
    "mouseleave blur": ->
      $("div.participation-not-allowed", this).hide()
  }, votes

但是现在，signup/signin div中的锚点链接不再可以通过tab键访问。

这是描述当前行为的图像

这是另一个描述所需实现的方法