Question

我的问题是我无法获取正在输入文本框的值，因此当单击选择按钮时，第二个下拉列表将仅显示与输入到文本框中的内容相关的数据。例如，如果在文本框中输入水果，我想让subcat下拉菜单中包含所有水果，而不是使用现有的类别下拉菜单

Answer 1

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

我在“SelectSubCat（）”中添加了一个名为txtValue的参数。这样你就可以传递你想要比较的值。

调用时，您需要使用文本字段的值调用“SelectSubCat（）”函数。我在名为“selectText”的文本字段中添加了一个id，当我点击我添加的按钮时

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

这将使用输入文本调用该函数。然后，它不使用表单中的值，而是使用传递给它的值，并创建适当的子类别。最后，您需要更改Category的“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");
}

}

javascript动态填充下拉列表，其中数组从值键入文本字段

1 个答案: