编程论坛 » JavaScript论坛 » js控制下拉列菜單的值

rgbtdkjcel 发表于 2007-12-18 14:45

js控制下拉列菜單的值

有兩個下拉菜單，在第一個下拉菜單中選擇不同的值，則第二列的下拉菜單的值也會顯示不同的內容。該如何實現!急1!!!!!!!!!

渚薰 发表于 2007-12-18 15:59

第一种方法，硬编码值，如下（假设第一个select的id为parent，其触发onchange事件的函数是selectParent，第二个select的id为children）;[code]/*
children的hash对象中，属性名即为parent的select里每一项的value值
*/
var children={
    'value1':[
               ['value1-subtext1','value1-subvalue1'],
               ['value1-subtext2','value1-subvalue2']
             ]
    'value2':[
               ['value2-subtext1','value2-subvalue1'],
               ['value2-subtext2','value2-subvalue2']
             ]
}

function selectParent() {
    var parent=document.getElementById('parent');
    var p_value=parent.options[parent.selectedIndex].value;
    renderChildren(children[p_value]);
}

function renderChildren(list) {
    if (list) {
       var children=document.getElementById('children');
       children.options.length=0;  //清空select中的选项
       for (var i=0;i<list.length;i++) {
           children.options.push(new Option(list[i][1],list[i][0]));
       }
    }
}[/code]第二种方法，ajax。不明白什么意思的话，就别管了。

查看完整版本: js控制下拉列菜單的值