Показать текстовое поле на конкретный вариант выбора - PullRequest
1 голос
/ 15 ноября 2011

Я пытаюсь изучить jQuery и не могу понять, как показать текстовое поле (конечно, на основе идентификатора), когда я выбираю конкретную опцию в своем теге выбора. У меня есть Google для ответа на мою проблему, но я пока ничего не нашел. Там я спрашиваю, как я могу это исправить. Смотри ниже, как я этого хочу.

По умолчанию:

Выберите тег

  • Вариант 1

  • Вариант 2

  • Вариант 3

Текстовое поле, которое по умолчанию скрыто.

Если я выберу Вариант 1 , текстовое поле остается скрытым. Если я выберу Вариант 2 , результат будет таким же, как и первый. Если я выберу Вариант 3 , текстовое поле будет видно. Если я выберу другую опцию, скажем Опция 2 обратно, текстовое поле будет скрыто.

Надеюсь, вы понимаете, о чем я:)

Заранее спасибо.

Ответы [ 3 ]

4 голосов
/ 15 ноября 2011

Посмотрите на это: http://jsfiddle.net/a8ZWx/

Вы можете использовать событие change элемента select, чтобы решить, показывать или скрывать текстовое поле.

2 голосов
/ 15 ноября 2011

jsfiddle Пример

Css

.hiddenField{
  display: none;
}

HTML:

<select id="myOptions"> 
    <option value="Option 1">Option 1</option>
    <option value="Option 2">Option 2</option>
    <option value="Option 3">Option 3</option>   
</select>
<input type="text" class="hiddenField" id="myTextBox" />

jQuery

$(document).ready(function(){
    $('#myOptions').change(function(){
       $(this).val() == "Option 2" ? $('#myTextBox').show() : $('#myTextBox').hide();
    });
});
0 голосов
/ 15 ноября 2011
$('#myselect').change(function(){

var val =$("#myselect :selected").val();

if(val == 'Option 3'){
      $('#textbox').show();

}
else{
     $('#textbox').hide();
}

});
...