選択値に基づいてフィールドを表示

Question

私は以下の挑戦をしています。

私は、人が新しいエントリを追加することができるエントリーフォームを持っています。承認されると、それを編集することもできます。 課題は、選択に基づいて特定のフィールドを非表示にすることです。 ユーザーが新しいエントリを追加するときに、特定のカテゴリを選択する必要があります。それに基づいて、いくつかのフィールドは隠されています。

これは私がこれまで使用していますコードです：ユーザーがまだカテゴリを選択しなければならないとき

<select name="entry.parent" size="1" style="width: 360px;" id="SPCatChooserSl" class="required"> 
<option value="">Selecteer categorie</option> 
<option selected="selected" value="55">- Option 1</option> 
<option value="59">- Option 2</option> 

</select> 

<div id="option1"> 
<p>Hier comes option 1</p> 
</div> 
<div id="option2"> 
<p>Here comes option 2</p> 
</div> 

<script> 
jQuery(function() { 
jQuery('#option1').hide(); 
jQuery('#option2').hide(); 
}); 

jQuery(function() { 
jQuery("#SPCatChooserSl").change(function() { 
    if (this.value == '55') { 
     jQuery('#option1').show(); 
    } else { 
     jQuery('#option1').hide(); 
    } 
    if (this.value == '59') { 
     jQuery('#option2').show(); 
    } else { 
     jQuery('#option2').hide(); 
    } 
    }); 
    }); 
    </script>  

は、これが動作します。選択に基づいてフィールドを非表示にします。

ユーザーがエントリを編集するとき、カテゴリは既に選択されており、変更されない可能性があります。そのため、DIVSオプション1とオプション2は非表示になり、ユーザーはカテゴリを選択しないため、divは決して表示されません。

質問：選択リストの特定の値を確認し、ユーザー操作なしの正しいフィールドを表示するにはどうすればよいですか。

私は私の質問/ challangeが明確であることを願っています:)事前に

感謝!!!!!!!文書の準備が完了したときに

Answer 1

あなたはオプションを更新することができます。

jQuery(function() { 
jQuery('#option1').hide(); 
jQuery('#option2').hide(); 
}); 

function updateOption() { 
    jQuery('#option1').toggle(this.value == '55'); 
    jQuery('#option2').toggle(this.value == '59'); 
} 

jQuery(document).ready(function() { 
    jQuery("#SPCatChooserSl").each(updateOption); 
    jQuery("#SPCatChooserSl").change(updateOption); 
}); 

フィドル：！http://jsfiddle.net/Mwnjk/