623

我可以设置一个单选按钮来检查罚款,但我想做的是设置一种在检查某个单选按钮时激活的“侦听器”。

以下面的代码为例:

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

它添加了一个选中的属性,一切都很好,但是我将如何添加警报。例如,在没有点击功能的帮助下选中单选按钮时会弹出?

4

18 回答 18

1165
$('#element').click(function() {
   if($('#radio_button').is(':checked')) { alert("it's checked"); }
});
于 2010-02-16T11:38:13.447 回答
170

如果您有一组共享相同名称属性的单选按钮,并且在提交或某些事件时您想检查这些单选按钮是否被选中,您可以通过以下代码简单地执行此操作:

$(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!');
    }
  });
});

来源

jQuery API 参考

于 2011-07-01T06:01:27.377 回答
49

由于 Parag 的解决方案给我带来了错误,这是我的解决方案(结合 David Hedlund 和 Parag 的):

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

这对我来说很好!

于 2013-06-07T13:26:44.487 回答
36

您必须绑定复选框的单击事件,因为更改事件在 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();
于 2010-02-16T11:57:29.697 回答
26

//通过类检查

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         
}
于 2014-01-06T11:51:14.463 回答
12

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

$("input[type=radio]").click(function () {
    if($(this).prop("checked")) { alert("checked!"); }
});
于 2015-09-19T13:25:56.943 回答
12

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

if($('#yourRadioButtonId').is(':checked')){ 
// Do your listener's stuff here. 
}
于 2017-05-24T09:10:15.413 回答
9

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

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

在这里工作 Jsfiddle

于 2016-06-01T07:24:42.697 回答
8

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

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

为我工作...

于 2013-09-14T12:08:53.997 回答
7

如果您不想要点击功能,请使用 Jquery 更改功能

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

这应该是您正在寻找的答案。如果您使用的是 1.9.1 以上的 Jquery 版本,请尝试使用 on,因为 live 功能已被弃用。

于 2013-05-02T07:49:13.357 回答
4

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

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

更改动态单选按钮

$('input[name^="radioname"]').change(function () {if (this.value == 2) { }else{}});
于 2016-05-18T07:47:16.380 回答
4

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

    if(typeof $('.radio-button-class-name:checked').val() !== 'undefined'){
     // radio button is checked
    }
于 2017-07-03T14:19:06.630 回答
3

试试这个

    if($('input[name="radiobutton"]:checked').length == 0) {
        alert("Radio buttons are not checked");
    }
于 2013-12-30T10:37:52.143 回答
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>

于 2019-04-30T09:20:33.727 回答
3

ULTIMATE SOLUTION 检测是否已使用 onChang 方法检查单选按钮 JQUERY > 3.6

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

获取单击的单选按钮的值

 var radioval=$('input[type=radio][name=YourRadioName]:checked').val();
于 2021-01-16T04:43:44.387 回答
2

试试这个:

alert($('#radiobutton')[0].checked)
于 2016-03-01T13:03:57.360 回答
1

这将适用于所有版本的 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>

于 2020-07-31T09:04:46.730 回答
-4
$("#radio_1").prop("checked", true);

对于 1.6 之前的 jQuery 版本,请使用:

$("#radio_1").attr('checked', 'checked');
于 2016-08-27T05:27:28.553 回答