Javascript 在不禁用事件的情况下对用户单击隐藏元素

我正在研究一个元素的可访问性问题。我需要隐藏此元素，以便用户在不禁用事件的情况下不能单击/点击它。我不想禁用它，因为如果它被禁用，voiceover将无法触发事件。我正在使用下面的css，但仍然有一个小的hitzone，我无法摆脱

position: absolute;
left: 15px;
top: 36px;
width: 0;
height: 0;
opacity: 0;

到目前为止，我所尝试的：

• 可见性：隐藏

• z-index:-1

• onmousedown

它不能像我希望的那样工作：(

编辑------------

因此，我尝试使用css，并添加了以下内容，以简单地重新定位select元素，并最大限度地减少用户单击/点击它的机会：

left: 0;
top: -36px;
z-index: 100;

---

因此，仍然有一个hitzone，但几乎不可能有人点击它。Voiceover可以接受它，并且不会改变用户的任何行为。

您是否尝试过显示：无。试一试。如果没有，请在这里发布您的代码，这样我们就可以看到实际问题。

为什么不让元素透明化呢t、 这样，用户将无法单击或点击它，您仍将获得事件。

如果您使用的是引导，您可以尝试使用“仅sr”类

如果不是，那么，从中“借用”风格也没有坏处：

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  border: 0;
}

我从中借用了这个示例，因为我手头没有引导源代码，但它看起来很准确

---

你可以从

指针事件中找到更多信息？添加一些代码，这样我们就可以看到问题或aria标签？你能用left:-999em将其移到屏幕外吗？或者它需要在视图中吗？你可能想在这里更详细地解释这个场景-不清楚为什么你想让一个元素不可见，但只对画外音用户可见-这是为什么ceOver only功能？是的，这将不起作用，因为画外音不会与隐藏元素交互。请使用z索引将其置于其他元素之后。这可能是一种尝试！：）不知何故，该事件会在该位置触发，因此如果用户无法单击/点击它，则voiceover也将无法启动。这很有趣，但我没有使用引导功能：（不管一些用户界面人员会告诉你什么，你都可以在没有引导的情况下使用CSS。你可以把这个类放到你自己的CSS中，并在你的元素上使用它，它应该工作得很好。