在特定选项上显示文本字段选择答案

【问题标题】：Show a text field on a specific option select在特定选项上显示文本字段选择
【发布时间】：2011-11-15 03:15:50
【问题描述】：

我正在尝试学习一些 jQuery，但我不知道如何在我的选择标签中选择特定选项时显示文本字段（当然是基于 ID）。我已经用谷歌搜索了我的问题的答案，但我还没有找到任何东西。在那里我问你我该如何解决这个问题。看看下面我想要的。

默认：

选择标签

选项 1
选项 2
选项 3

默认隐藏的文本字段。

如果我选择选项 1，文本字段将保持隐藏状态。如果我选择 Option 2，结果与第一个相同。如果我选择 Option 3，文本字段将可见。如果我选择另一个选项，再次说选项 2，文本字段将被隐藏。

希望你明白我的意思:)

提前致谢。

【问题讨论】：

标签： jquery input show option

【解决方案1】：

看看这个：http://jsfiddle.net/a8ZWx/

您可以使用选择元素的change 事件来决定是显示还是隐藏文本框。

【讨论】：

【解决方案2】：

jsfiddle Example

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();
    });
});

【讨论】：

【解决方案3】：

$('#myselect').change(function(){

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

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

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

});

【讨论】：

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