Javascript 如何防止链接在未使用显示块隐藏时被制表位阻止？

我正在尝试实现一个简单的下拉列表，带有一个滑动下降的效果。为了构建这个效果，我使用了一个应用于height属性的CSS转换

问题是如果我按Tab键↹ 键，则下拉列表中停止的任何targetable元素选项卡都将成为目标，即使它被隐藏，因为我没有使用display:none

代码如下：

const button=document.getElementById'button'； const dropdown=document.getElementById'dropdown'； setProperty'height'、'auto'、'important'； dropdown.style.setProperty'height'，dropdown.clientHeight+'px'； 按钮。添加EventListener“单击”，函数E{ e、 target.classList.toggle'active'； e、 target.nextElementSibling.classList.toggle'active'； }; 下拉列表{ 溢出：隐藏； 过渡段：高度330ms线性； 背景颜色：浅灰色； 高度：200px； } 下拉列表：not.active{ 高度：0！重要； } 下拉列表{ 能见度：可见； } 点击我！

---

此链接将集中在三个选项卡之后，而不是两个选项卡之后：尝试将属性tabindex设置为-1，这将阻止链接使用选项卡进行选择。当下拉菜单处于活动状态时，您也可以使用JS简单地删除此属性

您可以修改元素的tabIndex-1使其不可定位，非常高的数字使其最后成为目标

那么，你需要tab键来完成它的自然功能吗？@assembler我需要tab键来完成它的自然功能，但是由于我实际上没有用display:none隐藏下拉列表，tab键将在下拉列表中的链接处停止，这不是用户所期望的。因此，如果display:none；选项卡应跳转到下一个组件。。。对吗？@assembler完全正确。如果下拉列表中的“显示”属性设置为“无”，则tab键将无法定位其中的链接。根据tabindex将组件tabindex设置为负值只能应用于无法使用tab选择的元素，而不能应用于父元素。如果我想用JS实现这一点，我必须从下拉列表中获取所有内容，添加此属性，并在可见时将其删除。这是唯一的办法吗？