如何从组中的多个复选框中获取选定的复选框值（最多可以选择一个）

Question

我有 3 个复选框，需要用户一次最多选择一个，所以有一个代码，每次用户选择我的一个复选框。我取消选择所有其他并使用以下命令检查所选的：

$('input.myclass').click(function () {
    $('input.myclass:checked').not(this).removeAttr('checked');
});

就在这段代码下方，我还获得了选中复选框的值并将其显示在页面的某个位置（为简单起见，让它保持警惕）。为此，我正在使用：

var sFilter = "";
$('input.myclass[type=checkbox]').each(function () {
    sFilter = sFilter + (this.checked ? $(this).val() : "");
});

现在，sFilter 总是最近选中复选框和最后选中复选框。比如：如果我有复选框 1、2、3。最初，当我选择复选框 2 时，我在警报中得到 2，但是当我选择 3 时，我得到 2,3。我认为这里发生的事情是代码通过具有特定类的所有复选框，它仍然认为我有复选框 2 checked 考虑到我刚刚使用 click 函数清除/取消选中。

有人对我如何解决这个问题有建议吗？

谢谢

注意：由于用户界面，无法使用单选按钮。

Answer 1

一种可能的解决方案是在这些复选框的点击事件中循环遍历这些复选框。

即使你在点击按钮时循环遍历它们，你也会没事的。

检查这个 Jsfiddle-http://jsfiddle.net/LMgFz/

$('input.myclass').click(function () {
$('input.myclass:checked').not(this).removeAttr('checked');
 var sFilter = "";
$('input.myclass[type=checkbox]').each(function () {
    sFilter = sFilter + (this.checked ? $(this).val() : "");
});
alert(sFilter);
});

如果有意义？

Answer 2

为什么不尝试这样的事情（这里是jsFiddle）：

var sFilter = "";

$('input.myclass').click(function () {
    $('input.myclass:checked').not(this).removeAttr('checked');
    sFilter = (this.checked ? $(this).val() : "");
    alert(sFilter);
});

每次单击时，您都会更新sFilter，然后对它做任何您想做的事情。

如果您不想在取消选择时“提醒”，请尝试以下操作：

var sFilter = "";

$('input.myclass').click(function () {
    $('input.myclass:checked').not(this).removeAttr('checked');
    sFilter = (this.checked ? $(this).val() : "");
    if (sFilter != "") alert(sFilter);
});