使用JQuery检查是否已检查组中的单选按钮


107

我正坐在一个问题上,我需要使用JQuery来检查单选按钮组中是否没有选中任何单选按钮,以便在用户忘记选择某个选项时向他们显示javascript错误。

我正在使用以下代码来获取值

var radio_button_val = $("input[name='html_elements']:checked").val();

Answers:


146
if (!$("input[name='html_elements']:checked").val()) {
   alert('Nothing is checked!');
}
else {
  alert('One of the radio buttons is checked!');
}

17
如果选中的单选按钮具有value =“”,则此操作将失败
ScottE 2010年

1
@ScottE-妙点-如果Roland不接受,我将删除此答案。
多米尼克·罗杰

我认为您可以将其更改为.val() == ""并删除!,这样便可以完成所有工作。
Doug Neiner 2010年

@Doug-那还会有ScottE提到的问题吗?.val()如果选中的单选按钮具有,将返回什么value=""?(尽管我想您可能会认为那是一个不太可能的情况)。
多米尼克·罗杰

1
抱歉,我的评论令人困惑:我的意思是整个测试看起来像这样:if ($("input[name='html_elements']:checked").val() == "")会提醒“什么都没有检查”
Doug Neiner 2010年

144

我正在使用

$("input:radio[name='html_radio']").is(":checked")

如果未选中单选组中的所有项目,则返回FALSE;如果选中了某个项目,则返回TRUE。


3
这个答案对我来说确实有效,可以检查单选按钮组是否具有选定的值。线程中的最佳答案。
安迪·库克

1
多米尼克·罗杰(Dominic Rodger)和雅各布·埃尔南德斯(JacoboHernández)的回答都很好。我个人试图在行的开头永远不要使用开头的NOT(!)。多年后,当您忽略它并向后逻辑时,很难调试... is(“:checked”)非常清楚您在做什么-最佳答案。
斯科特,

32

您可以执行以下操作:

var radio_buttons = $("input[name='html_elements']");
if( radio_buttons.filter(':checked').length == 0){
  // None checked
} else {
  // If you need to use the result you can do so without
  // another (costly) jQuery selector call:
  var val = radio_buttons.val();
}

2
您不能将前两行缩小到正好if ($("input[name='html_elements']:checked").length == 0){吗?
Powerlord 2010年

7
您可以,但是如果您显示存在值,则需要另一个完整的jQuery选择来获取值。
Doug Neiner 2010年

5
if ($("input[name='html_elements']:checked").size()==0) {
   alert('Nothing is checked!');
}
else {
  alert('One of the radio buttons is checked!');
}



2

我认为这是一个简单的示例,如何检查一组收音机中的某个收音机是否已检查。

if($('input[name=html_elements]:checked').length){
    //a radio button was checked
}else{
    //there was no radio button checked
} 

0

我用的很简单

的HTML

<label class="radio"><input id="job1" type="radio" name="job" value="1" checked>New Job</label>
<label class="radio"><input id="job2" type="radio" name="job" value="2">Updating Job</label>


<button type="button" class="btn btn-primary" onclick="save();">Save</button>

脚本

 $('#save').on('click', function(e) {
    if (job1.checked)
        {
              alert("New Job"); 
        }
if (job2.checked)
        {
            alert("Updating Job");
        }

}

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.