从下拉列表中获取值并创建另一个下拉列表答案

【问题标题】：Get value from dropdownlist and create another dropdown list从下拉列表中获取值并创建另一个下拉列表
【发布时间】：2015-06-12 19:00:05
【问题描述】：

我创建了一个下拉列表，它看起来像这样

 <select id="mySelect">
       <option value="one">Do one</option>
       <option value="two">Do two</option>
      </select>

首先，我不希望有提交按钮。我正在搜索的第二件事是，当我选择第一个选项以显示另一个下拉列表时，当我选择第二个选项以显示一个文本输入供用户键入内容时。谢谢你，对不起英语！

【问题讨论】：

好吧，至少你应该在给出这个任务之前表明你正在尝试编写一些代码。如果您编写了代码但它不起作用，我们愿意为您提供帮助。

标签： html list button drop-down-menu

【解决方案1】：

如果您不想导入任何 jQuery，您仍然可以使用纯 JavaScript 来完成。

Here is a demo

只需在文件中包含以下脚本，

function myFun(){
    var val = document.getElementById("mySelect");
    var input = document.getElementById("myIn");
    var sel = document.getElementById("myOtherSelect");
    var sub = document.getElementById("mySubmit");
    if(val.value == "one"){
        sel.style.display = "block";
        input.style.display = "none";
        sub.style.display = "none";
    }else if(val.value == "two"){
        input.style.display = "block";
        sub.style.display = "block";
        sel.style.display = "none";
    }else{
        input.style.display = "none";
        sub.style.display = "block";
        sel.style.display = "none";
    }
}

现在在您的选择上添加 onchange 事件，

    <select id="mySelect" onchange="myFun()">
       <option value="emp" selected>Choose something</option> 
       <option value="one">Do one</option>
       <option value="two">Do two</option>
    </select>
    <select id="myOtherSelect">
       <option value="three">Do three</option>
       <option value="four">Do four</option>
    </select>
    <input type="text" id="myIn">
    <input type="submit" id="mySubmit">

【讨论】：

感谢您的回答...它帮助了我很多...我想要纯 javascript 和 html..问题是我希望文本输入显示（连同一个按钮）当我在第一个选择上单击选项二..你有什么想法吗？
@elenaa 你说的是哪个按钮？
@elenaa 你想让文本框和下拉菜单在单行中可用吗？
通常我想要一个包含两个选项的下拉列表。如果有人选择第一个选项，则会出现另一个下拉列表。如果有人选择第二个选项，则会出现一个文本输入和一个按钮（“提交”）。
@elenaa 查看我的更新答案和更新演示

【解决方案2】：

使用 jQuery 做一些简单的事情，比如：

$('#mySelect').on('change', function() {
  $('#input').html('<input name="myname" value="'+this.value +'">');
})

JSFiddle

【讨论】：