jQuery單選按鈕顯示div

Question

嘿傢伙，我可以用什麼函數來說，如果這個單選按鈕被選中顯示這個'div'。 在此先感謝。

Answer 1

HTML

<form id='form-id'> 
    <input id='watch-me' name='test' type='radio' /> Show Div<br /> 
    <input name='test' type='radio' /><br /> 
    <input name='test' type='radio' /> 
</form> 
<div id='show-me' style='display:none'>Hello</div> 

jQuery的

$('#form-id').change(function() { 
    if ($('#watch-me').attr('checked')) { 
     $('#show-me').show(); 
    } else { 
     $('#show-me').hide(); 
    } 
}); 

你可以看到它在這裏的行動：http://jsfiddle.net/wmKGd/

UPDATE 2013年1月25日
從jQuery庫1.8.x的升級後的1.9.x
請使用而不是
jQuery庫1.8.x的

jQuery('#some-id').attr('checked') 

jQuery庫的1.9.x

jQuery('#some-id').prop('checked') 

你可以在這裏看到它與更新的腳本：http://jsfiddle.net/9XXRY/

Answer 2

$("myradiobuttonselector").change(function() { 
    if ($(this).attr("checked")) { 
    $("mydivSelector").show(); 
    } 
    else { 
    $("mydivSelector").hide(); 
    } 
}); 

Answer 3

這就是我使用的。將「mydiv」替換爲您單選按鈕的ID，並將「content1」替換爲您要顯示/隱藏的內容。

發佈一些html，如果你需要進一步的幫助。

$(document).ready(function(){ 
    $('#content1').hide(); 

    $('a').click(function(){ 
     $('#content1').show('slow'); 
    }); 

    $(‘#mydiv’).click(function(){ 
     $('#content1').hide('slow'); 
    }) 
}); 

裏克

Answer 4

我喜歡@ tinifni的jsfiddle。這裏有3個div，根據收音機顯示或隱藏。

http://jsfiddle.net/dbwest/wmKGd/572/

$('#form-id').change(function() { 
    if ($('#watch-me').attr('checked')) { 
     $('#show-me').show(); 
    } else { 
     $('#show-me').hide(); 
    } 
    if ($('#watch-me2').attr('checked')) { 
     $('#show-me2').show(); 
    } else { 
     $('#show-me2').hide(); 
    } 
    if ($('#watch-me3').attr('checked')) { 
     $('#show-me3').show(); 
    } else { 
     $('#show-me3').hide(); 
    } 
});