使用jquery查找没有答案的单选按钮组

Question

我一直在绞尽脑汁寻找更好的解决方案来解决以下情况。

想象一个页面上有很多单选按钮，然后进行一些自定义验证，突出显示尚未回答的单选按钮组。

示例 html（预先选择了一些答案）：

<input type='radio' name='a' value='1' />
<input type='radio' name='a' value='2' />
<input type='radio' name='a' value='3' />
<input type='radio' name='b' value='1' checked="checked"//>
<input type='radio' name='b' value='2' />
<input type='radio' name='b' value='3' />
<input type='radio' name='c' value='1' />
<input type='radio' name='c' value='2' checked="checked"/>
<input type='radio' name='c' value='3' />
<input type='radio' name='d' value='1' />
<input type='radio' name='d' value='2' />
<input type='radio' name='d' value='3' />

我已经编写了一些 jQuery 来实现我想要的功能，但我只知道它可以做得更好/更快/更漂亮/更有效。

//select all radiobuttons
var $radios = $("input[type='radio']")
//loop through all the radios that are checked
$($radios+":checked").each(function(){
    //filter out all radios with the current name, and add something to recognize them with
    $($radios).filter("[name='" + $(this).attr("name") + "']").addClass("checked")
});

//find all radios without the class checked, and highlight them
var $unchecked_radios = $($radios + ":not(.checked)").addClass("highlight");

但我一直不知道如何将这两者结合起来，因此从整个收音机中减去有答案的那些。

（尽管我怀疑可能有更好的方法来选择具有相同名称的单选按钮组）

任何帮助将不胜感激！

问候， 卡斯帕

Answer 1

我不知道是否可以提供帮助，这里有一些代码：

$(document).ready(function() {
        $('input:not(:checked)').each(function() {
            if($('input[name='+$(this).attr('name')+']:checked').size() == 0)
            {
                $(this).addClass('highlight');
            }
        });
    });

有了这个，您只需突出显示尚未检查任何无线电的组中未经检查的无线电。
它符合您的需求吗？

Answer 2

这个怎么样？

function is_answered(valueName)
{
  var result=$('input[name='+valueName+']:checked').size();
  return result > 0;
}

Answer 3

试试这个：

var $radios = $("input[type='radio']")
//loop through all the radios that are checked
$radios.filter(":checked")
.each(function(){
    //filter out all radios with the current name, and add something to recognize them with
    $($radios).filter("[name='" + $(this).attr("name") + "']").addClass("checked")
})
.end()
.filter(":not(.checked)").addClass("highlight");

根据用例，这可能会更好：

$("input[type='radio']").filter(":not(:checked)").addClass("highlight");

但我不知道您是否还需要“checked”类来做其他事情。