找出是否使用 JQuery 检查了单选按钮？答案

【问题标题】：Find out whether radio button is checked with JQuery?找出是否使用 JQuery 检查了单选按钮？
【发布时间】：2011-01-17 08:49:54
【问题描述】：

我可以将单选按钮设置为选中，但我想做的是设置一种“侦听器”，在选中某个单选按钮时激活。

以如下代码为例：

$("#element").click(function()
{ 
    $('#radio_button').attr("checked", "checked");
});

它添加了一个选中的属性，一切都很好，但是我该怎么做添加警报。例如，当单选按钮被选中时弹出没有点击功能的帮助？

【问题讨论】：

Check of specific radio button is checked的可能重复
相关Monitoring when a radio button is uncheckedstackoverflow.com/questions/5824639/…

标签： jquery html jquery-ui checked

【解决方案1】：

终极解决方案 使用 onChang 方法检测单选按钮是否被选中 查询 > 3.6

         $('input[type=radio][name=YourRadioName]').change(()=>{
             alert("Hello"); });

获取被点击的单选按钮的值

 var radioval=$('input[type=radio][name=YourRadioName]:checked').val();

【讨论】：

【解决方案2】：

这适用于所有版本的 jquery。

//-- Check if there's no checked radio button
if ($('#radio_button').is(':checked') === false ) {
  //-- if none, Do something here    
}

在选中某个单选按钮时激活某些功能。

// get it from your form or parent id
    if ($('#your_form').find('[name="radio_name"]').is(':checked') === false ) {
      $('#your_form').find('[name="radio_name"]').filter('[value=' + checked_value + ']').prop('checked', true);
    }

你的html

$('document').ready(function() {
var checked_value = 'checked';
  if($("#your_form").find('[name="radio_name"]').is(":checked") === false) {
      $("#your_form")
        .find('[name="radio_name"]')
        .filter("[value=" + checked_value + "]")
        .prop("checked", true);
    }
  }
)

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form action="" id="your_form">
  <input id="user" name="radio_name" type="radio" value="checked">
        <label for="user">user</label>
  <input id="admin" name="radio_name" type="radio" value="not_this_one">
    <label for="admin">Admin</label>
</form>

【讨论】：

【解决方案3】：

jQuery 仍然很流行，但如果你想没有依赖项，请参见下文。 Short & clear 函数来判断是否在 ES-2015 上选中了单选按钮：

function getValueFromRadioButton( name ){
  return [...document.getElementsByName(name)]
         .reduce( (rez, btn) => (btn.checked ? btn.value : rez), null)
}

console.log( getValueFromRadioButton('payment') );

<div>  
  <input type="radio" name="payment" value="offline">
  <input type="radio" name="payment" value="online">
  <input type="radio" name="payment" value="part" checked>
  <input type="radio" name="payment" value="free">
</div>

【讨论】：

当我尝试在堆栈溢出中运行您的代码 sn-p 时，它似乎无法作为测试工作，您可以编辑它以便我们轻松尝试它。但是它似乎在我的项目上工作并且非常非常感谢。

【解决方案4】：

$('.radio-button-class-name').is('checked') 对我不起作用，但下一个代码运行良好：

    if(typeof $('.radio-button-class-name:checked').val() !== 'undefined'){
     // radio button is checked
    }

【讨论】：

由于您将它与类而不是 ID 一起使用，因此它会返回一个节点列表，而不是一个元素。 $('.radio-button-class-name').first().is(':checked') 应该有效。

【解决方案5】：

解决方案很简单，因为当检查某个单选按钮时，您只需要“侦听器”。这样做：-

if($('#yourRadioButtonId').is(':checked')){ 
// Do your listener's stuff here. 
}

【讨论】：

【解决方案6】：

$("#radio_1").prop("checked", true);

对于 1.6 之前的 jQuery 版本，使用：

$("#radio_1").attr('checked', 'checked');

【讨论】：

这设置 checked 属性的值，而不是查询它。

【解决方案7】：

使用所有类型的单选按钮和浏览器

if($('#radio_button_id')[0].checked) {
   alert("radiobutton checked")
}
else{
   alert("not checked");
}

Working Jsfiddle Here

【讨论】：

【解决方案8】：

动态生成单选按钮检查单选获取值

$("input:radio[name=radiobuttonname:checked").val();

关于改变动态单选按钮

$('input[name^="radioname"]').change(function () {if (this.value == 2) { }else{}});

【讨论】：

【解决方案9】：

试试这个：

alert($('#radiobutton')[0].checked)

【讨论】：

【解决方案10】：

另一种方法是使用prop (jQuery >= 1.6)：

$("input[type=radio]").click(function () {
    if($(this).prop("checked")) { alert("checked!"); }
});

【讨论】：

确实.prop() 更快，而且更容易输入。

【解决方案11】：

如果您有一组共享相同名称属性的单选按钮，并且在提交或某些事件时您想检查其中一个单选按钮是否被选中，您可以通过以下代码简单地做到这一点：

$(document).ready(function(){
  $('#submit_button').click(function() {
    if (!$("input[name='name']:checked").val()) {
       alert('Nothing is checked!');
        return false;
    }
    else {
      alert('One of the radio buttons is checked!');
    }
  });
});

Source

jQuery API Ref

【讨论】：

这对我不起作用。如果我 alert($("input[@name='shipping_method']:checked").val());即使没有选择单选按钮，它仍然会给我这个值。
注意：如果您有多个表单，其中包含使用相同名称的单选按钮组，您需要确保只检查提交的表单。一种选择是使用表单上的 find 方法：$('#myform').submit(function(event){ if (!$(this).find("input[name='name']:checked").val()) {

【解决方案12】：

由于 Parag 的解决方案给我带来了错误，这是我的解决方案（结合 David Hedlund 和 Parag 的）：

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

这对我来说很好用！

【讨论】：

【解决方案13】：

//通过类检查

if($("input:radio[class='className']").is(":checked")) {
     //write your code         
}

//通过名称检查

if($("input:radio[name='Name']").is(":checked")) {
         //write your code         
}

//查看数据

if($("input:radio[data-name='value']").is(":checked")) {
         //write your code         
}

【讨论】：

【解决方案14】：

试试这个

    if($('input[name="radiobutton"]:checked').length == 0) {
        alert("Radio buttons are not checked");
    }

【讨论】：

【解决方案15】：

...谢谢大家...我所需要的只是选中的单选按钮的“值”，其中集合中的每个单选按钮都有不同的 id...

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

为我工作...

【讨论】：

【解决方案16】：

如果您不想要点击功能使用jquery改变函数

$('#radio_button :checked').live('change',function(){
alert('Something is checked.');
});

这应该是您正在寻找的答案。如果您使用 1.9.1 以上的 Jquery 版本 try to use on as live 功能已被弃用。

【讨论】：

【解决方案17】：

$('#element').click(function() {
   if($('#radio_button').is(':checked')) { alert("it's checked"); }
});

【讨论】：

宾果游戏！谢谢大卫。那么我是否必须调用一个动作（点击等）来显示警报？有没有办法做到这一点不点击？
这并没有解决“没有点击功能的帮助”，是吗？
@Znarkus：OP 看起来很满意。你会争辩说你自己对('#radio_button').click的使用没有click吗？
@David 第二行应该是if ($('#radio_button').is(':checked'))) { alert("it's checked"); } - 你忘记了jQuery $ 符号，然后需要将它全部用括号括起来。
@zua：你是对的！它甚至有一个语法错误，就像以前一样（不匹配的括号）。固定

【解决方案18】：

你必须绑定复选框的点击事件，因为更改事件在 IE 中不起作用。

$('#radio_button').click(function(){
    // if ($(this).is(':checked')) alert('is checked'); 
    alert('check-checky-check was changed');
});

现在，当您以编程方式更改状态时，您还必须触发此事件：

$('#radio_button').attr("checked", "checked");
$('#radio_button').click();

【讨论】：