div内のラジオボタンの1つがチェックされているかどうかを確認してください

Question

このスクリプトでは、ほとんどの場合、（ラジオボタンがチェックされているかどうか調べています）そのうちの1つがチェックされている場合は、アラートが1つだけ必要です。

背景情報： これがチェックされていると、次のdivが表示されます。そうでない場合、divは表示されません。私のシステムの上では、チェックされたラジオボタンをクリックするとチェックが外され、表示されたdivは非表示になります。

マイコード：ここで

<div class="divtop"> 
    <input type="radio" name="r1" value="v1" /> 
    <input type="radio" name="r1" value="v2" /> 
    <input type="radio" name="r1" value="v3" /> 
<div> 

はスクリプトです：

$('.divtop input:radio').live('click', function(event) { 
    var div = $("div.divtop"); 
    var radiobuttons = div.find("input[type='radio']"); 
for (var i = 0; i < radiobuttons.length; i++) { 
    if (radiobuttons[i].type === 'radio' && radiobuttons[i].checked) { 
    alert ('on') // action 
    } else { 
    alert ('off') // action 
}} }); 

どのように私は、ラジオボタンのいずれかがチェックされている場合にのみ1つのアラートを取得するには、このスクリプトを適応させることができますか？

ラジオボタンのグループごとに異なる状況で適用されるため、この関数は汎用（ラジオボタン名の使用なし）でなければなりません。あなたのポストにあなたのコメントに応えて

Answer 1

あなたがチェックすることができますラジオ、別の部門を表示します。

$(document).ready(function(){ 
 
    $('.divtop > input:radio').change(function(){ 
 
     if($(this).is(":checked")) 
 
     { 
 
     $('.divMiddle').removeClass('hide'); 
 
     } 
 
    }); 
 
});

.hide 
 
{ 
 
    display: none; 
 
} 
 
.show 
 
{ 
 
    display: block; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="divtop"> 
 
    <input type="radio" name="r1" value="v1" />ONE 
 
    <input type="radio" name="r1" value="v2" />TWO 
 
    <input type="radio" name="r1" value="v3" />THREE 
 
<div> 
 
<div class="divMiddle hide"> 
 
    <input type="radio" name="r11" value="v11" /> ONE 
 
    <input type="radio" name="r11" value="v22" /> TWO 
 
    <input type="radio" name="r11" value="v33" /> THREE 
 
</div>

Answer 2

、それは私に発生したあなたは唯一のいくつかの簡単なCSSで欲しいものを達成できる：最初のdivがチェックしている場合

[type="radio"], [type="radio"]:checked + .inner{ 
 
    display:block; 
 
} 
 

 
.inner{ 
 
    display:none 
 
}

<div class="divtop"> 
 
    <input checked type="radio" name="r1" value="v1" /> 
 
    <div class="inner">ONE</div> 
 
    <input type="radio" name="r1" value="v2" /> 
 
    <div class="inner">TWO</div> 
 
    <input type="radio" name="r1" value="v3" /> 
 
    <div class="inner">THREE</div> 
 
<div>