html - 如何在表单之外制作单选按钮？

Question

我正在尝试编写一个动态表单，所以我不能使用正常的表单标签和东西。我使用普通按钮、JQuery 和 AJAX 调用来模拟传统表单。但是，我不知道如何做单选按钮。有什么帮助吗？

编辑：是的，我想我应该更具体。我试着做

<input type="radio" />

和东西，但是：

1. 它让我一次可以选择多个按钮（这会破坏单选按钮的意义）
2. 它不会让我在按下按钮后取消选择！

编辑 2：我不使用表单标签的原因是我也需要多个提交按钮，而我发现的唯一解决方案是不使用表单标签。

Answer 1

为什么不能使用表单标签？没有什么能阻止你这样做。但是如果你不想使用表单标签，为什么不呢：

<input type='radio' name='test' value='1' checked>
<input type='radio' name='test' value='2'>
<input type='radio' name='test' value='3'>
<input type='radio' name='test' value='4'>

对我来说很好。演示

编辑：

1：您需要为无线电组指定一个名称，否则每个输入都被视为自己的组。因此，为什么您在使用时可以一次选择多个按钮<input type="radio" />。看看我上面的代码。广播组是“测试”。

2：单选按钮应该有一个默认值。创建单选组时，您应该使用选中的属性指定默认值。这样做的结果是您无法取消选择单选按钮。您可以选择不同的值或坚持使用默认值。如果您希望能够取消选择，请考虑使用复选框。我已经更新了示例代码以反映这一点。

Answer 2

如果您能够选择多个单选按钮，则听起来您的名称属性不匹配。你想要结束的是如下所示：

<input type="radio" name="group-1" value="something-unique">
<input type="radio" name="group-1" value="something-else-unique">
<input type="radio" name="group-1" value="another-unique-something">

<input type="radio" name="group-2" value="something-unique">
<input type="radio" name="group-2" value="something-else-unique">
<input type="radio" name="group-2" value="another-unique-something">

请注意，选项组的名称属性相同，这意味着选项将相互替换。

此外，当纯粹使用 javascript 使用它们时，我没有在表单标签中包装收音机没有任何问题，但是如果你想做任何 html 帖子的东西，我希望它们是必需的。

Answer 3

你可以试试这个：

HTML

<div>
     <ul>
        <li><input type="radio" name="radio" value="value1" checked>Radio Button1</input></li>
        <li><input type="radio" name="radio" value="value1">Radio Button2</input></li>
        <li><input type="radio" name="radio" value="value1">Radio Button3</input></li>
     </ul>
</div>

演示

Answer 4

不应该有没有表单元素的输入元素。如果您没有正确使用它，您将无法让 HTML 以您希望的方式响应。多个提交按钮将表明需要多个表单。

如果无论出于何种原因，这不起作用，也许您应该重新考虑您要求用户提交信息的格式。