web-dev-qa-db-ja.com

ラジオボタンがJQueryでチェックされているかどうか調べますか?

ラジオボタンを細かくチェックするように設定することができますが、私がやりたいことは、特定のラジオボタンがチェックされるとアクティブになる一種の「リスナー」を設定することです。

たとえば、次のようなコードを取ります。

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

それはchecked属性を追加し、すべてがうまくいっています、しかし私はアラートを追加することについてどのように行くでしょうか。たとえば、クリック機能を使用せずにラジオボタンをチェックすると表示されますか。

537
Keith Donegan
$('#element').click(function() {
   if($('#radio_button').is(':checked')) { alert("it's checked"); }
});
988
David Hedlund

同じ名前属性を共有するラジオボタンのグループがあり、送信時またはこれらのラジオボタンのいずれかがチェックされているかどうかを確認するイベントがある場合は、次のコードで簡単に確認できます。

$(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リファレンス

140
Parag

Paragの解決策が私にエラーを投げかけたので、これが私の解決策です(David HedlundとParagの組み合わせ)。

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

これは私のためにうまくいきました!

38
Patrick DaVader

ChangeイベントはIEでは機能しないため、チェックボックスのclickイベントをバインドする必要があります。

$('#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();
31
Znarkus

//クラスをチェックする

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         
}
18
Nanhe Kumar

特定のラジオボタンがチェックされているときは「リスナー」が必要なだけなので、解決策は簡単です。それをしなさい: -

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

別の方法は prop (jQuery> = 1.6) を使うことです。

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

クリック機能が不要な場合は、Jquery change機能を使用してください。

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

これがあなたが探している答えです。 1.9.1以上のJqueryバージョンを使用している場合は、ライブ関数は推奨されていなかったのでonを使用してみてください。

6
iCezz

...おかげで...私が必要としたのは、セット内の各ラジオボタンのIDが異なるチェック済みラジオボタンの「値」だけでした...

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

私のために働く...

5
Bill Warren

あらゆる種類のラジオボタンやブラウザを使った作業

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

ここで働くJsfiddle

4
Thyagu

動的に生成されたラジオボタンラジオが値を取得する

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

動的ラジオボタンの変更時

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

$( '。radio-button-class-name')。is( 'checked')は私にはうまくいきませんでしたが、次のコードはうまくいきました:

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

これを試して

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

これを試して:

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

jQueryはまだ人気がありますが、依存関係を持たない場合は、以下を参照してください。 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>
0
MaxWall