使用jquery在选择菜单中选择的特定值上显示输入框[关闭]答案

【问题标题】：Display input box on particular value selected in select menu using jquery [closed]使用jquery在选择菜单中选择的特定值上显示输入框[关闭]
【发布时间】：2014-01-22 19:15:24
【问题描述】：

只有在使用 jquery 在下面给出的选择菜单中选择“汽车”时，我才希望显示输入字段。

<select name="type">
  <option value="plane">Plane</option>
  <option value="car">Car</option>
</select>

<input type="text" name="name">

可以使用 jQuery 吗？

【问题讨论】：

你知道change事件是什么吗？你知道如何找到一个选择的价值吗？你知道如何显示/隐藏元素吗？如果你知道这三个，把它们放在一起。
为什么这个问题被否决了？有什么不清楚的地方？殿下，StackOverflow 专家，您必须点击那个向下箭头吗？

标签： javascript jquery html

【解决方案1】：

使用这个：

Dom：

<select name="type">
  <option value="plane">Plane</option>
  <option value="car">Car</option>
</select>
<input class="hideme" type="text" name="name">

Jscode：

$('select').change(function(){
if($(this).val()=== "car")
$('.hideme').show();
else
    $('.hideme').hide();
}).change();

Working Fiddle

【讨论】：

另外，在准备好文档时，您也应该检查选择值 :)
很好。我们可以在 document.ready 上触发 select 的更改事件。

【解决方案2】：

您可以使用toggle 方法：

$(function () {
    $('select[name=type]').change(function () {
        $('input[name=name]').toggle(this.value === "car" ? true : false);
    }).change();
});

【讨论】：

这是关于可见性，你知道...
@SilviuBurcea 我不明白你的评论？！
哦，对不起，我误解了你的切换功能。我以为你在设置输入值。

【解决方案3】：

是的，你可以通过标签来获取值，然后用一个语句来判断是否显示它所在的输入字段或容器。

以下是检索这些值的参考： How do I get the text value of a selected option?

这是我刚刚在 SO 实际上找到的答案，它的作用类似于您正在寻找的东西： jQuery: show an element from select drop down

【讨论】：

【解决方案4】：

您可以添加一个空选项并执行以下操作：

$("[name='type']").change(
 function(){
  if($(this).val() == "car"){
   $("[name='name']").show();
   }else{
    $("[name='name']").hide();
   }
 }
);

【讨论】：

【解决方案5】：

<select name="type" onchange="showTextBox(this.value)">
  <option value="plane">Plane</option>
  <option value="car">Car</option>
</select>
<input  type="hidden" id="MyBox">
<script>
function showTextBox(item){
      if(item=="car"){$('#MyBox').show();}
}
</script>

【讨论】：

您的答案中未定义 hideme 类。如果选择“飞机”，则不会隐藏 MyBox，如果选择“汽车”，则不会在页面加载时显示 MyBox。
@BernhardHofmann 请正确阅读问题，我根本不需要 hideme 课程。我可以简单地输入 type="hidden"。为什么-1这个答案，我不明白。
您的编辑修复了未选择“汽车”时输入框可见的事实。这就是投反对票的原因；它没有提供有效的答案。既然您已修复该投票，该投票已被删除。