单击文本以选择相应的单选按钮

问题描述

我正在使用PHP创建一个测验Web应用程序。每个问题由一个单独的< label> 组成，有4个可能的选择，使用单选按钮以选择他/她的答案。单个问题的当前HTML如下：

I'm creating a quiz web application using PHP. Each question is comprised of a separate <label> and has 4 possible choices, using radio buttons to allow the user to select his/her answer. The current HTML for a single question looks like:

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

我希望用户可以点击与单选按钮相关联的文本。现在，用户只能点击单选按钮本身 - 我觉得这是一个相当麻烦的任务。

I would like the user to have the option of clicking on the text associated with radio button. Right now, the user can only click on the radio button itself - which I find to be a quite cumbersome task.

我阅读了，并且建议指向使用于和 id 标记的属性匹配。我已经这样做，它仍然不工作。

I read Unable to select a particular radio button choice by clicking on the choice text and the suggestion points toward making the for and id attributes of the tags match. I have done this and it still doesn't work.

我的问题是：我想点击< input type =radio> ; 对象，而不是只能选择单选按钮本身。我知道我以前读过这个，但似乎找不到任何解决我的问题。任何帮助或建议都非常感谢！

My question is: I'd like to be able to click the text of an <input type="radio"> object, as opposed to only being able to select the radio button itself. I know I've read about this before but can't seem to find any solution to my problem. Any help or suggestions are much appreciated!

推荐答案

在代码中，您在表单本身上有一个标签。您想要为每个单独的广播组添加标签，如下所示。

In your code, you've got a label on the form itself. You want to put labels on each individual radio group, as shown below.

<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 属性，使单选按钮作为一个组，并且一次只允许单个选择。

You should keep in mind that two elements should never have the same ID. The name attribute is used so that the radio buttons function as a group and only allow a single selection at a time.

这篇关于单击文本以选择相应的单选按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！