Html 如何使隐藏列表中的链接项目可单击

我正在为一个只有Html和CSS的响应页面创建一个菜单。当平板电脑和手机的页面小于850px时，水平菜单将隐藏，用户必须单击按钮才能访问该菜单。它是一个平滑滚动的单页

但是，当您打开菜单时，链接不会单击。我注意到，当我取消隐藏菜单时，链接工作正常。如何使链接可点击？我想这可能与链接被另一个项目覆盖有关

任何帮助都将不胜感激

/***********隐藏菜单部分*************/ 隐藏菜单项{ 显示：无； 位置：绝对位置； z指数：2； } /*******这将在单击时显示菜单*******/ 输入[类型=图像]{ 光标：指针； } 输入[类型=图像]：焦点{ 大纲：无； } 输入[类型=图像]：焦点+隐藏菜单项{ 显示：块； } 这是HTML ```

---

我认为一旦你点击链接，输入就会失去焦点，所以它们又被隐藏起来了

我建议使用jQuery在单击时添加/删除一个类，并根据这一点调整CSS，或者使用jQuery更改CSS

下面是一个例子：

$“隐藏菜单输入”。单击，函数E{ $'hidden-menu-items'。切换类'visible'； }; 隐藏菜单项{ 显示：无； 位置：绝对位置； z指数：2； } hidden-menu-items.visible{ 显示：块； } 隐藏菜单{ 边框：1px纯红； }

---

单击链接时，图像输入将失去焦点模糊，链接将消失 模糊事件发生在单击事件之前，因此您不能在不存在的对象上使用单击

使用：将焦点放在父对象上

/***********隐藏菜单部分*************/ 隐藏菜单项{ 显示：无； 位置：绝对位置； z指数：2； } /*******这将在单击时显示菜单*******/ 输入[类型=图像]{ 光标：指针； } 隐藏菜单：焦点在{ 大纲：无； } 隐藏菜单：隐藏菜单项内的焦点{ 显示：块； }

---

“我认为这可能与链接被另一个项目覆盖有关。”-这通常很容易验证，如果您将光标移动到元素上，然后右键单击并检查…如果链接顶部有其他内容，则您将在元素面板中着陆，而不是在你的链接上。你能处理你的问题吗？我明白了，谢谢04FS，似乎链接就在topA VanillaJS的右边。解决方案是：document.getElementById'hidden-menu'。querySelector'input'。addEventListener'click'，function{document.getElementById'hidden-menu-items'。classList.toggle'visible}谢谢@kristinadavidovic，这个也很好用。我还没有学会任何jQuery，但我更喜欢CSS解决方案。@WayneRichardhendricks没问题。这里也有jQuery解决方案，因此，如果将来需要它，您知道应该在哪里查找：我很高兴你得到了答案。谢谢你@yunzen，这正是我想要的。它工作得很好。我发现大约80%的浏览器支持这个功能。Chrome、IE、Firefox、Opera、Safari和IOS。哎呀！你说得对。但针对每个浏览器有多重要？我的意思是，从数字上看，世界似乎已经决定不使用微软浏览器了。像UC这样的浏览器有3%的市场份额，但充斥着恶意软件。