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"); 
} 

}