How do I navigate to hidden anchors?

问题

I have a hidden element on my page with id select-box:

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

There's a <label> at the top of my page:

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

Because the <select> is hidden, clicking on the <label> has no effect. Is there a way to achieve this, preferably without using any JavaScript?

回答1:

The css feature display:none; removes the element from the document.

try:

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

visibility:hidden keeps the element in the dom and also takes up space so I've given a width of 0px to ensure no blank space will remain.

回答2:

Ignoring the fact you are missing the link to your anchor in what you posted, you're right it looks like "display:none" anchors don't work (see: http://jsfiddle.net/odwneeL7/). But you can easily just make an anchor with no content beside what you want to link to, eg:

<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">

See fiddle: http://jsfiddle.net/odwneeL7/1/

来源：https://stackoverflow.com/questions/30379263/how-do-i-navigate-to-hidden-anchors