javascript中的条件下拉菜单,选择器的问题

时间:2014-04-18 23:04:03

标签: javascript jquery html css

我有一个条件下拉菜单,但它取决于我把它放在页面上的位置。如果我没有把它放在特定的位置,菜单中的位置根本不会填满。问题还在于我想添加第二个条件下拉列表,无论我把它放在哪里,它都不起作用。所以我的问题是:我是否需要在页面上添加两次脚本以对应我拥有的两种形式?我实际上希望两个下拉都填写完全相同的单词。

document.forms[0]['List'+i].length = 1;
document.forms[0]['List'+i].selectedIndex = 0;

我猜测它与[0]相关的东西。我尝试在表单中添加一个id,然后编写第二个脚本document.forms('myId')[],但这也不起作用。我应该怎么做呢?

<script type="text/javascript">

var categories = [];
categories["startList"] = ["Programming","Science","History","Business and Economics","Software","Languages","Do it Yourself","Others"];
categories["Programming"] = ["Java","C++","C.","Python","Html","Php","Mysql","ObjectiveC","Android","Others"];
categories["Science"] = ["Mathematics","Physics","Biology","Chemistry","Medicine","Astronomy","Statistics","Others"];
categories["Others"] = ["All"] 

var nLists = 2; // number of lists in the set

function fillSelect(currCat,currList){
    var step = Number(currList.name.replace(/\D/g,""));
    for (i=step; i<nLists+1; i++) {
        document.forms[0]['List'+i].length = 1;
        document.forms[0]['List'+i].selectedIndex = 0;
    }
    var nCat = categories[currCat];
    for (each in nCat)  {
        var nOption = document.createElement('option'); 
        var nData = document.createTextNode(nCat[each]); 
        nOption.setAttribute('value',nCat[each]); 
        nOption.appendChild(nData); 
        currList.appendChild(nOption); 
    } 
}

function getValue( L2, L1) {
    $.post( "", { List1: L1, List2: L2 } );
}

function init() {
    fillSelect('startList',document.forms[0]['List1'])
}

navigator.appName == "Microsoft Internet Explorer" ? attachEvent('onload', init, false) : addEventListener('load', init, false);    

</script>




<form action="" method="post">
<select name='List1' onchange="fillSelect(this.value,this.form['List2'])">
<option selected>Category</option>
</select>

&nbsp;
<select name='List2' onchange="getValue(this.value,this.form['List1'].value)">
<option selected >Subcategory</option>
</select>
<input type="Submit">

1 个答案:

答案 0 :(得分:0)

修正了它。我只需要添加一个选择器或1来对应我的第二个表单。

 document.forms[1]['List'+i].length = 1;
            document.forms[1]['List'+i].selectedIndex = 0;
        }
        var nCat = categories[currCat];
        for (each in nCat)  {
            var nOption = document.createElement('option'); 
            var nData = document.createTextNode(nCat[each]); 
            nOption.setAttribute('value',nCat[each]); 
            nOption.appendChild(nData); 
            currList.appendChild(nOption); 
        } 
    }

    function getValue( L2, L1) {
        $.post( "", { List1: L1, List2: L2 } );
    }

    function init() {
        fillSelect('startList',document.forms[1]['List1'])