jquery - jQueryを使用してラジオ入力に基づいて自動的に非表示のdivを表示するにはどうすればよいですか?

Question

いいえがチェックされているときにdivを表示するために使用したいyes/noラジオグループがあります。いいえがまだチェックされていない限り、ページの読み込み時にdivを非表示にする必要があります。

yes から no に変更すると機能しますが、ページの読み込み時に div が表示されます。最初にeuResidentNo入力がチェックされているかどうかをテストする必要があると思いますが、その方法がわかりません。また、これが必要なものを達成するための最良の方法であるかどうかもわかりません。ありがとう。

フィドル

http://jsfiddle.net/paulyabsley/2Uj9F/5/

HTML

<input type="radio" name="euResident" id="euResidentYes" value="Yes" />
<input type="radio" name="euResident" id="euResidentNo" value="No" />

<div id="div">
    ...
</div>

jQuery

$(document).ready(function() {
    $("input[name=euResident]").change(function(){
        if($("#euResidentNo").prop("checked"))
        {
            $("#div").show();
        }
        else
        {
            $("#div").hide();
        }
    });
});

Answer 1

changeページの読み込み時にハンドラーをトリガーするだけです

$('input[name=euResident]').change();

ここにフィドルがあります

また、コードを次のように単純化できます。

$("input[name=euResident]").change(function(){
    $('#div').toggle( $('#euResidentNo').is(':checked') );
}).change(); 

Answer 2

ハンドラーの最後に追加.change()すると、すぐに呼び出されます。

$("input[name=euResident]").change(function(){
    if($("#euResidentNo").prop("checked"))
    {
        $("#div").show();
    }
    else
    {
        $("#div").hide();
    }
}).change();

Answer 3

function switchVar() {
    if($("#euResidentNo").prop("checked"))
        $("#div").show();
    else
        $("#div").hide();
}

$(document).ready(function() {
    switchVar();
    $("input[name=euResident]").change(switchVar);
});

フィドル

これにより、no がチェックされているかどうかがチェックされ、チェックされている場合は div が表示されます。

Answer 4

。引き金（）

$('input[name=euResident]').trigger('change');