JQueryは選択に基づいて表示と非表示を切り替えます

Question

投稿する前に多くの研究を行いましたが、これまでのところ見つからないことが私の問題を解決してくれないようです。

私は選択に基づいてオプションを表示/非表示しようとしていますが、これまでのところ片方向で動作しています。 Art Printが選択されている場合Extra lonオプションは非表示になっていますが、Strech印刷に戻すと余分な長さが無効のままです。

jQuery("select#input_5_2").change(function($) { 
 
\t event.preventDefault(); 
 
\t if ("select#input_5_2 option:selected[value!='Stretched Canvas Print|0']"){ 
 
\t \t jQuery('select#input_5_3').children('option[value="Extra Long|0"]').prop("disabled", true); 
 
\t } 
 
\t 
 
});

<select name="input_2" id="input_5_2" onchange="gf_apply_rules(5, [5, 6, 7, 8, 10, 11, 12, 13, 14, 15, 16, 18, 19, 20, 21, 22, 23]);" class="medium gfield_select form-control" tabindex="1" aria-invalid="false"> 
 
    <option value="Stretched Canvas Print|0" price="">Stretched Canvas Print</option> 
 
    <option value="Art Print|0" price="">Art Print</option> 
 
    <option value="Framed Print|0" price="">Framed Print</option> 
 
    <option value="Rolled Canvas|0" price="">Rolled Canvas</option> 
 
</select> 
 
<select name="input_3" id="input_5_3" onchange="gf_apply_rules(5, [5, 6, 7, 8, 10, 11, 12, 13, 14, 15, 16, 18, 19, 20, 21, 22]);" class="medium gfield_select form-control" tabindex="2" aria-invalid="false"> 
 
    <option value="Landscape|0" price="">Landscape</option> 
 
    <option value="Portrait|0" price="">Portrait</option> 
 
    <option value="Square|0" price="">Square</option> 
 
    <option value="Extra Long|0" price="" disabled="">Extra Long</option> 
 
</select>

Answer 1

これを試してください：あなたは無効にするオプションを想定すると

jQuery("#input_5_2").change(function($) { 
    if(jQuery(this).val() == "Art Print|0") { 
     jQuery("#input_5_3 option:last").prop('disabled', true); 
    } else { 
     jQuery("#input_5_3 option:last").prop('disabled', false) 
    } 
}); 

は最後のオプションです。