ページロードのラジオボタン選択に応じて特定のフィールドを表示

Question

データベースからデータをドラッグして、選択したラジオボタンに応じて異なる無効なフォームフィールドを表示します。

私はonload = "javascript：...."を使用しようとしましたが、動作しません。

HTML：

<fieldset> 
     <legend>Employment/Education Details</legend> 
     <div class="input-wrapper"> 
     <label>Are you?<br> 
     <input type="radio" onload="javascript:employmentCheck();" name="employment_status" value="employed" id="employed" <?php if 
($employment_status=="employed") echo "checked"; ?> disabled><label for="employed">Employed</label> 
     <input type="radio" onload="javascript:employmentCheck();" name="employment_status" value="self_employed" id="self_employed" <?php if 
($employment_status=="self_employed") echo "checked"; ?> disabled><label for="self_employed">Self Employed</label> 
     <input type="radio" onload="javascript:employmentCheck();" name="employment_status" value="student" id="student" <?php if 
($employment_status=="student") echo "checked"; ?> disabled><label for="student">Student</label> 
     <input type="radio" onload="javascript:employmentCheck();" name="employment_status" value="other" id="other" <?php if 
($employment_status=="other") echo "checked"; ?> disabled><label for="other">Other</label> 
     </label> 
     </div> 
     <div id="college_nus" style="display:none"> 
     <div class="row"> 
      <div class="large-6 columns"> 
       <div class="input-wrapper"> 
        <label>College or NUS Number 
        <input type="text" name="college_nus" value="<?php echo $college_nus; ?>" disabled> 
        </label> 
       </div> 
      </div> 
     </div> 
     </div> 
     <div id="employment_details" style="display:none"> 
    <div class="row"> 
      <div class="large-6 columns"> 
       <div class="input-wrapper"> 
        <label>Employer Name 
        <input type="text" name="employment_company" value="<?php echo $employment_company; ?>" disabld> 
        </label> 
       </div> 
      </div> 
      <div class="large-6 columns"> 
       <div class="input-wrapper"> 
        <label>Job Title 
        <input type="text" name="employment_title" value="<?php echo $employment_title; ?>" disabled> 
        </label> 
       </div> 
      </div> 
     </div> 
     <div class="row"> 
      <div class="large-6 columns"> 
       <div class="input-wrapper"> 
        <label>Employment Address 
        <textarea name="employment_address" rows="4" value="<?php echo $employment_address; ?>" disabled></textarea> 
        </label> 
       </div> 
      </div> 
      <div class="large-6 columns"> 
       <div class="input-wrapper"> 
        <label> 
        Occupation 
        <input type="text" value="<?php echo $occupation; ?>" disabled> 
        </label> 
       </div> 
      </div> 
     </div> 
     <div class="row"> 
      <div class="large-6 columns"> 
       <div class="input-wrapper"> 
        <label>Employment Email 
        <input type="text" name="employment_email" value="<?php echo $employment_email; ?>" disabled> 
        </label> 
       </div> 
      </div> 
      <div class="large-6 columns"> 
       <div class="input-wrapper"> 
        <label>Employment Phone 
        <input type="text" name="employment_phone" value="<?php echo $employment_phone; ?>" disabled> 
        </label> 
       </div> 
      </div> 
     </div> 
     </div> 
    </fieldset> 

Javascriptを：

function employmentCheck() { 
    if (document.getElementById('student').checked) { 
     document.getElementById('college_nus').style.display = 'block'; 
    } 
    else document.getElementById('college_nus').style.display = 'none'; 

    if (document.getElementById('employed').checked || document.getElementById('self_employed').checked) { 
     document.getElementById('employment_details').style.display = 'block'; 
    } 
    else document.getElementById('employment_details').style.display = 'none'; 

} 

誰も助けてくださいことはできますか？

Answer 1

関数をwindow.onloadに変更しても問題ありません。ここにはプランカがあります。ここで

https://plnkr.co/edit/Pz2rKRg9geglgKhdJM4H?p=preview

が機能

window.onload = function(){ 
    if (document.getElementById('student').checked) { 
     console.log("student"); 
     document.getElementById('college_nus').style.display = 'block'; 
    } 
    else { 
     document.getElementById('college_nus').style.display = 'none'; 
    } 

    if (document.getElementById('employed').checked || document.getElementById('self_employed').checked) { 
     console.log("employed"); 
     document.getElementById('employment_details').style.display = 'block'; 
    } 
    else { 
     document.getElementById('employment_details').style.display = 'none'; 
    } 
} 

である私は、ラジオボタンオブジェクトに定義されたのonloadのイベントがあるとは思いません。働いていないことで

おかげ

パラス