如何导航到隐藏的锚点？答案

【问题标题】：How do I navigate to hidden anchors?如何导航到隐藏的锚点？
【发布时间】：2015-05-21 16:20:05
【问题描述】：

我的页面上有一个隐藏元素，ID 为 select-box：

<select style="display:none;" id="select-box">

我的页面顶部有一个<label>：

<label for="select-box">Select box</label>

因为<select>是隐藏的，所以点击<label>没有效果。有没有办法实现这一点，最好不使用任何 JavaScript？

【问题讨论】：

究竟实现了什么？如果 select 不存在，用户希望如何使用它？此外，这是一个表单元素，而不是锚。

标签： html css tags anchor

【解决方案1】：

css 功能显示：无；从文档中删除元素。

尝试：

style="visibility:hidden; width:0px"

visibility:hidden 将元素保留在 dom 中并占用空间，因此我给出了 0px 的宽度以确保不会留下任何空白空间。

【讨论】：

你可能需要这个..stackoverflow.com/questions/3475119/…

【解决方案2】：

忽略您在发布的内容中缺少指向锚点的链接这一事实，您是对的，看起来“显示：无”锚点不起作用（请参阅：http://jsfiddle.net/odwneeL7/）。但是您可以轻松地在要链接的内容旁边制作一个没有内容的锚点，例如：

<label for="select-box"><a href="#select-box-anchor">Select box</a></label><br/>

...content...

    <a id="select-box-anchor"></a><select style="display:none;" id="select-box">

见小提琴：http://jsfiddle.net/odwneeL7/1/

【讨论】：

我不认为 OP 打算使用锚。听起来他想让标签聚焦一个隐藏的<select> 元素，这似乎不起作用。集中隐藏输入的目的尚不清楚。但是，您使用锚点的想法似乎是一个不错的解决方案。