html - 隐藏单选按钮，同时保持其功能

Question

我在 SO 和 Google 上搜索，但找不到任何相关内容。有什么方法可以隐藏图像旁边的单选按钮(用作它的标签)，但在单击标签时仍然保持其功能？

我尝试了几种方法，但似乎使用 display:none 或 visibility:hidden 会使 radio 功能无用。

Answer 1

I have tried several methods but it seems that using display:none or visibility:hidden makes the radio function useless.

但它有效。也许你没有设置 for 属性:

<input id=radio1 name=testradios type=radio><label for=radio1>radio1</label>
<br>
<input id=radio2 name=testradios type=radio><label for=radio2>radio2</label>

#radio1 {
    display: none;
}

或

#radio1 {
    visibility: hidden;
}

两者都隐藏单选按钮但标签仍然可点击并检查其单选按钮。

http://jsfiddle.net/m0fbd75w/