Отображение элемента, основанного на выборе - jQuery, HTML

Question

Я пытаюсь показать второй элемент select только в том случае, если выбран какой-то вариант первого.

Должно быть прямо, но оно не работает.

Итак, у меня есть несколько элементов выбора класса «один», за которыми следует выбор o «два». В рамках функции готовности документа я сначала спрячу все выборки класса «два»: $('.two').hide(); отлично работает.
Тогда у меня есть функция (также в рамках функции готовности документа), чтобы показать следующий выбор класса «два», если определенное значение выбрано из выбора класса «один».

$('.one').change(function() { 
    var two= $(this).next('.two'); 
    if ($(this).val()==3){ 
     if(two.is(':hidden')) { 
      two.fadeIn(50); 
     }else{ 
      two.fadeOut(50); 
     } 
    } 
}); 

Может кто-нибудь сказать мне, что я делаю неправильно?

Answer 1

Скорее всего у вас есть другие элементы между двумя выбирает, так что вам нужно использовать метод nextAll как этот

var two= $(this).nextAll('.two:first'); 

Метод next(selector) возвращает точно следующий sibling если он соответствует селектору.

Кроме того я считаю, что у вас есть неправильное вложение МСФ .. Теперь вы показать/скрыть только если значение 3 (как Скрытие и отображение происходит, если значение .one составляет 3)

Пример: http://jsfiddle.net/UXS2X/

изменение

if ($(this).val()==3){ 
     if(two.is(':hidden')) { 
      two.fadeIn(50); 
     }else{ 
      two.fadeOut(50); 
     } 
    } 

в

if ($(this).val()==3){ 
     if(two.is(':hidden')) { 
      two.fadeIn(50); 
     } 
    } 
else{ 
     two.fadeOut(50); 
    } 

Answer 2

попробуйте вместо этого:

if ($('select.two option:selected').val()==3){ 
... 
}