具有单选按钮功能的按钮答案

【问题标题】：Button with radio button functionality具有单选按钮功能的按钮
【发布时间】：2011-12-12 02:33:25
【问题描述】：

我想知道您是否可以制作一个按钮，其功能类似于 HTML 单选按钮。我正在尝试创建一个表单，其中用户单击所述按钮并因此选择了一个值，但直到选择另一个选项并提交表单后，用户才会被引导。有谁知道该怎么做？

（我不介意使用其他语言，包括 javascript 等）

【问题讨论】：

你能详细说明一下吗？您的问题并不完全清楚。
和下面这个人发布的功能差不多。

标签： javascript html forms radio-button

【解决方案1】：

jQueryUI has a Button Widget 将单选按钮或复选框转换为按钮。

来自网站的示例：

http://jqueryui.com/demos/button/#radio

<script>
$(function() {
    $( "#radio" ).buttonset();
});
</script>

<div class="demo">
    <form>
        <div id="radio">
            <input type="radio" id="radio1" name="radio" /><label for="radio1">Choice 1</label>
            <input type="radio" id="radio2" name="radio" checked="checked" /><label for="radio2">Choice 2</label>
            <input type="radio" id="radio3" name="radio" /><label for="radio3">Choice 3</label>
        </div>
    </form>
</div>

您可以访问该链接以查看它的实际效果。

【讨论】：

【解决方案2】：

首先，在您正在谈论的页面上，听起来好像用户被带到了其他地方 - 即，采取了类似提交的操作 - 只是通过他选择一个单选按钮。我不认为这是最好的做法。

其次，您应该保留两个单选按钮：它们工作得很好，一旦选择，单选按钮无法清除，除非选择另一个按钮。这正是你想要的。

为确保您需要的两个按钮已被选中，请为每个按钮提供一个设置开关的 onclick 处理程序：该组中的某个按钮已被选中。

然后，当他点击提交时，检查这两个开关并告诉他是否忘记点击按钮。

是的，您需要 JavaScript 来完成这一切。

【讨论】：