JavaScript动态填充下拉从值输入到文本字段

Question

您好我在这里提供一个代码示例数组：http://jsbin.com/oxoweh

我的问题是，我不能让正在进入到文本框中的值，这样，当点击选择按钮，第二个下拉菜单将只显示与在文本框中输入内容有关的数据。因为如果水果输入到文本框的例子，我想有SUBCAT下拉拥有所有的水果在里面，而不是使用现有的类别下拉菜单

Answer 1

http://jsfiddle.net/goldentoa11/P3hs8/1/

的我添加了一个参数，以此来“SelectSubCat（）”之称txtValue。这样你就可以传递你想要比较的值。

当您调用它时，需要使用文本字段的值调用“SelectSubCat（）”函数。我添加了一个ID名为“selectText”文本字段，当我按一下按钮我又增加了

onclick="SelectSubCat(document.getElementById('selectText').value)" 

，这将调用该函数与输入的文本。然后，不使用表单中的值，而是使用传递给它的值，并创建适当的子类别。最后，您需要将类别的“onchange”函数更改为传递空字符串。

function SelectSubCat(txtValue) { 

if(txtValue == "") txtValue = document.drop_list.Category.value; 
// This line is to set txtValue to Category's value if the current value is blank. 
// In other words, if it was called by changing the dropdown, 
// give it the drop down's value. 

// ON selection of category this function will work 
removeAllOptions(document.drop_list.SubCat); 
addOption(document.drop_list.SubCat, "", "SubCat", ""); 

if (txtValue == 'Fruits') { 
    addOption(document.drop_list.SubCat, "Mango", "Mango"); 
    addOption(document.drop_list.SubCat, "Banana", "Banana"); 
    addOption(document.drop_list.SubCat, "Orange", "Orange"); 
} 
if (txtValue == 'Games') { 
    addOption(document.drop_list.SubCat, "Cricket", "Cricket"); 
    addOption(document.drop_list.SubCat, "Football", "Football"); 
    addOption(document.drop_list.SubCat, "Polo", "Polo", ""); 
} 
if (txtValue == 'Scripts') { 
    addOption(document.drop_list.SubCat, "PHP", "PHP"); 
    addOption(document.drop_list.SubCat, "ASP", "ASP"); 
    addOption(document.drop_list.SubCat, "Perl", "Perl"); 
} 

}