jQuery选择选项 - 仅显示特定选项的内容

Question

我想要做的就是，仅在所选选项“其他”（值= 18）时显示“other_option_content”类，当选择任何其他选项时显示&例如：“脸谱“的类”other_option_content“不显示（隐藏）。

HTML：

<Select id="userr_category_hear_id"> 
    <option value="">please choose</option> 
    <option value="13">Google/Search Engine</option> 
    <option value="14">Radio/TV</option> 
    <option value="15">Facebook/LinkedIn</option> 
    <option value="16">Someone from your company contacted me directly</option> 
    <option value="17">A friend told me about it</option> 
    <option value="18">Other</option> 
</Select> 

<div class="other_option_content"> 
<div class="input text required user_hear"> 
    <textarea class="text required" id="userr_hear" name="userr[hear]" placeholder="www.google.com"> 
    </textarea> 
</div> 
</div> 

Answer 1

在这里你去：

// hide by default; 
 
$('.other_option_content').hide(); 
 

 
$('#userr_category_hear_id').change(function() { 
 
    if ($(this).val() == 18) { 
 
    $('.other_option_content').show(); 
 
    } else { 
 
    $('.other_option_content').hide(); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<Select id="userr_category_hear_id"> 
 
    <option value="">please choose</option> 
 
    <option value="13">Google/Search Engine</option> 
 
    <option value="14">Radio/TV</option> 
 
    <option value="15">Facebook/LinkedIn</option> 
 
    <option value="16">Someone from your company contacted me directly</option> 
 
    <option value="17">A friend told me about it</option> 
 
    <option value="18">Other</option> 
 
</Select> 
 

 
<div class="other_option_content"> 
 
    <div class="input text required user_hear"> 
 
    <textarea class="text required" id="userr_hear" name="userr[hear]" placeholder="www.google.com"> 
 
    </textarea> 
 
    </div> 
 
</div>