опция выбора jQuery - отображение содержимого только для определенной опции

Question

Все, что я хочу сделать, отображает класс «other_option_content» только для выбранной опции «other» (значение = 18) &, если выбрана любая другая опция, например: facebook "класс" 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>