JQuery Hide Div, когда выбран вариант

Question

Я хочу скрыть класс DIV, когда выбрано определенное значение OPTION

    <select id="tagtype" name="type">
        <option value="type_s">Standard</option>
        <option value="type_o">Overstock</option>
        <option value="type_snd">Scratch &amp; Dent</option>
        <option value="type_mult">Multiples</option>
    </select>

<div class="multiples>stuff here</div>

<script type="text/javascript"> 
$(document).ready(function() {
  if ($("#tagtype option[value='type_mult']").length)
   $("multiples").css('display','none');

});
</script>

Answer 1

Лучшим способом сделать это, вероятно, было бы что-то вроде следующего:

jQuery(document).ready(function() {
   jQuery("#tagtype").change(function() {
      if(jQuery(this).find("option:selected").val() == "type_mult") {
         jQuery(".multiples").hide();
      }
   });
});

Вы связываете обработчик с событием onChange поля выбора. Всякий раз, когда вы выбираете новую опцию в поле выбора, вызывается обработчик.

В обработчике this относится к полю выбора, которое вызвало событие onChange. Вы ищите значение выбранной опции. Если это значение равно «type_mult», вы скрываете все элементы с классом multiples.

Проблема с вашим существующим кодом в том, что он будет выполняться только один раз; когда страница впервые загружается. Вы должны реагировать на изменения в поле выбора, поэтому вам необходимо привязаться к событию onChange. Еще одна проблема - оператор if. Даже если вы использовали свой код и в обработчике onChange, он вводит блок if для каждого типа, потому что вы не проверяете, выбрана ли опция со значением «type_mult». Вы просто проверяете, существует ли он. Поскольку всегда существует, код внутри if всегда будет выполняться. Кроме того, когда вы хотите использовать имена классов, вам нужно поставить точку перед именем класса. Таким образом, вы хотите сделать $(.multiples), а не просто $(multiples) (последний будет искать тег с именем multiples, а это не то, что вам нужно).

Answer 2

Требуется немного больше информации - что на самом деле происходит, когда вы запускаете этот код?

Я думаю, что второй селектор jQuery неверен:

$(".multiples").css('display','none');