为 html 页面添加单选按钮

【问题标题】：adding the radio button for html page为 html 页面添加单选按钮
【发布时间】：2022-11-17 02:50:14
【问题描述】：

在我的 html 页面中，我无法添加两个单选按钮，我在 free-code-camp 中遇到错误，即将在 label 元素中有两个单选按钮，在输入自关闭标签中它们的属性具有相同的名称值.

我在 label 元素内的 input 标签中尝试了相同的 name 属性值。但我得到了错误。

【问题讨论】：

你的代码在哪里？

标签： html

【解决方案1】：

下面的示例显示了三个具有相同名称的单选按钮，它们位于一个标签内、一个表单内。

这是一个有效的结构。

const handleSubmission = (form, event) => {
  event.preventDefault();
  console.log(`Choice: ${form.elements.foo.value}`);
};

<form onSubmit="handleSubmission(this, event)">
  <label>
    <strong>Choice:</strong>
    <input type="radio" name="foo" value="a" /> A
    <input type="radio" name="foo" value="b" /> B
    <input type="radio" name="foo" value="c" /> C
  </label>
  <button type="submit">Submit</button>
</form>

【讨论】：