单击文本以选择相应的单选按钮
单击文本以选择相应的单选按钮
提问于 2011-10-23 07:17:08
我正在使用PHP创建一个测验web应用程序。每个问题由一个单独的<label>组成，并有4个可能的选项，使用radio buttons允许用户选择他/她的答案。单个问题的当前HTML如下所示：
<label for="349">What is my middle name?</label>
<br>
<input id="349" type="radio" value="1" name="349">Abe
<br>
<input id="349" type="radio" value="2" name="349">Andrew
<br>
<input id="349" type="radio" value="3" name="349">Andre
<br>
<input id="349" type="radio" value="4" name="349">Anderson
<br>我希望用户有选择点击文本与单选按钮。现在，用户只能点击单选按钮本身-我发现这是一个相当繁琐的任务。
我阅读了Unable to select a particular radio button choice by clicking on the choice text，其中的建议是让标记的for和id属性匹配。我已经这样做了，但它仍然不起作用。
我的问题是：我希望能够单击 <input type="radio"> 对象的文本，而不是只能选择单选按钮本身。我知道我以前读过这方面的内容，但似乎找不到任何解决问题的方法。如有任何帮助或建议，我们不胜感激！
回答 6
Stack Overflow用户
回答已采纳
发布于 2011-10-23 07:23:21
在您的代码中，您在窗体本身上有一个标签。您希望为每个单选按钮组添加标签，如下所示。
<form>
<p>What is my middle name?</p>
<br>
<input id="349" type="radio" value="1" name="question1">
<label for="349">Abe</label>
<br>
<input id="350" type="radio" value="2" name="question1">
<label for="350">Andrew</label>
<br>
<input id="351" type="radio" value="3" name="question1">
<label for="351">Andre</label>
<br>
<input id="352" type="radio" value="4" name="question1">
<label for="352">Anderson</label>
<br>
</form>
您应该记住，两个元素永远不应该有相同的ID。使用name属性是为了使单选按钮作为一个组起作用，并且一次只允许一个选择。
Stack Overflow用户
发布于 2015-12-14 20:27:52
如果按照内森的回答，在单选按钮和标签之间似乎有一个无法点击的空格。下面是如何让它们无缝连接(参见this article)：
<form>
<p>What is my middle name?</p>
<br>
<label><input id="349" type="radio" value="1" name="question1">Abe</label>
<br>
<label><input id="350" type="radio" value="2" name="question1">Andrew</label>
<br>
<label><input id="351" type="radio" value="3" name="question1">Andre</label>
<br>
<label><input id="352" type="radio" value="4" name="question1">Anderson</label>
<br>
</form>Stack Overflow用户
发布于 2011-10-23 07:24:04
标签标签应该在每个答案的周围，例如在Abe，Andrew等周围。而且对于它们中的每一个，它都需要是唯一的。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/7863251
复制相关文章
相似问题
腾讯云开发者
