javascript显示下拉菜单时，前一个下拉菜单已经选择了什么
javascript显示下拉菜单时，前一个下拉菜单已经选择了什么
提问于 2015-02-24 08:19:55
我正在尝试使用javascript，我是一个初学者。当从上一个下拉菜单中更改值时，我试图获得一个下拉菜单。我想显示完全相同的下拉菜单，当上一个有一个值。所以，当你有3个下拉式菜单的值，你有4个下拉菜单与相同的选项等等。
所以我像这样使用oninput：
<select name="select" oninput="myFunction()">这是我从w3schools中使用的函数：
function myFunction() {
document.getElementById("demo").innerHTML = "<tr><td>
<select name='select' id='test' oninput='myFunction()'>
<option value='test'>test</option>
<option value='test'>test</option>
</select></td></tr>";
}这是demo id：
<table><div id="demo"> </div></table> 但我有两个问题。
- 当尝试使用它时，它是行不通的。但是，当我使用：
document.getElementById("demo").innerHTML = "test"
- 这没有显示相同的下拉菜单，因为我在
for中有原始下拉菜单的选项，但是我不能将<div id="demo"> </div>放在for循环中，因为它将显示下拉菜单中有多少选项。
我的问题是：
有没有办法在javascript函数中生成完全相同的下拉菜单？
如果没有，我的代码出了什么问题。
回答 1
Stack Overflow用户
发布于 2015-02-24 08:34:02
您必须使用jQuery ajax。将您的下拉列表放在html中(例如dropdown.html)
然后使用这个：
$("#id_of_first_dropdown").change(function(){
$("#div_where_u_want_new_select").load("path/to/dropdown.html", function(){
$("#div_where_u_want_new_select").fadeIn();
});
});在html中：
<select name="...">
<option>..</option>
</select>
<div id="div_where_u_want_new_select"></div>CSS：
#div_where_u_want_new_select {
display: none;
}在dropdown.html中
<select name="...">
<option>..</option>
</select>有了这个，你只能用一次。如果您希望这样做，可以无限地使用，因此其中一个可能的答案是更改js：
$("#id_of_first_dropdown").change(function(){
$.ajax({
url: "path/to/dropdown.html",
success: function(data){
$("#div_where_u_want_new_select").append(data);
$("#div_where_u_want_new_select").fadeIn();
}
})
});HTML：
<select name="...">
<option>..</option>
</select>
<div id="div_where_u_want_new_select0"></div>和dropdown.html
<select name="...">
<option>..</option>
</select>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/28690991
复制相关文章
相似问题
腾讯云开发者
