オンロードと変更をチェックする1つのイベントを作成します。

Question

チェックボックスをオンにすると、このコードを実行します。 b）デフォルトで非表示になっているセクションを展開する必要があることを確認するには、ページの読み込みを実行します。

$(document).ready(function() { 
    $('#hasContractorFlag').on('change', function() { 
     if ($(this).is(':checked')) { 
      $('#hasContractor').show(); 
     } else { 
      $('#hasContractor').hide(); 
     } 
    }); 
}); 

上記にloadイベントを追加しようとしましたが、トリガーされませんでした。

私はこれに似た何かをすることができ、それが働くだろう知っている：

$(document).ready(function() { 
    noAddress($('#hasContractorFlag')) 

    $('#hasContractorFlag').on('change', function() { 
     noAddress($(this)); 
    }); 

    function noAddress(var field) { 
     if ($(field).is(':checked')) { 
      $('#hasContractor').show(); 
     } else { 
      $('#hasContractor').hide(); 
     } 
    }; 
}); 

これを実現するための最良の方法は何ですか？すべて一緒に

function noAddress(field) { 
    field.is(':checked') ? $('#hasContractor').show() : $('#hasContractor').hide(); 
}; 

：

Answer 1

あなたは準備ができて文書にあなたの方法に.change();を追加した場合、それはその後、呼び出しますあなたの方法。

jsFiddle：http://jsfiddle.net/UQDaW/5/

$(document).ready(function() { 
    $('#hasContractorFlag').on('change', function() { 
     if ($(this).is(':checked')) { 
      $('#hasContractor').show(); 
     } else { 
      $('#hasContractor').hide(); 
     } 
    }).change(); // .change() will execute this method 
}); 

Answer 2

あなたはこれを試すことができます

$(document).ready(function() { 
    $('#hasContractorFlag').on('change load', function() { 
     noAddress($(this)); 
    }); 
    function noAddress(field) { 
     field.is(':checked') ? $('#hasContractor').show() : $('#hasContractor').hide(); 
    } 
}); 

DEMO

Answer 3

$(document).ready(function() { 
    $('#hasContractorFlag').on('change', function() { 
     $('#hasContractor')[$(this).is(':checked')?'show':'hide'](); 
    }).change(); 
}); 

Answer 4

私は通常、これは行く方法で変更イベント

$(document).ready(function() { 
    $('#hasContractorFlag').on('change', function() { 
     if ($(this).is(':checked')) { 
      $('#hasContractor').show(); 
     } else { 
      $('#hasContractor').hide(); 
     } 
    }).trigger('change'); 
});