html js三级菜单,js三级级联菜单

/p>

<

JavaScript Study

var oneArray = [‘请选择’, ‘1’, ‘2’, ‘3’, ‘4’, ‘5’];

var twoArray = [[‘请选择’], [‘1.1’, ‘1.2’, ‘1.3’], [‘2.1’, ‘2.2’, ‘2.3’], [‘3.1’, ‘3.2’, ‘3.3’], [‘4.1’, ‘4.2’, ‘4.3’], [‘5.1’, ‘5.2’, ‘5.3’]];

var threeArray = [[[‘请选择’]], [[‘1.1.1’, ‘1.1.2’, ‘1.1.3’], [‘1.2.1’, ‘1.2.2’, ‘1.2.3’], [‘1.3.1’, ‘1.3.2’, ‘1.3.3’]],

[[‘2.1.1’, ‘2.1.2’, ‘2.1.3’], [‘2.2.1’, ‘2.2.2’, ‘2.2.3’], [‘2.3.1’, ‘2.3.2’, ‘2.3.3’]],

[[‘3.1.1’, ‘3.1.2’, ‘3.1.3’], [‘3.2.1’, ‘3.2.2’, ‘3.2.3’], [‘3.3.1’, ‘3.3.2’, ‘3.3.3’]],

[[‘4.1.1’, ‘4.1.2’, ‘4.1.3’], [‘4.2.1’, ‘4.2.2’, ‘4.2.3’], [‘4.3.1’, ‘4.3.2’, ‘4.3.3’]],

[[‘5.1.1’, ‘5.1.2’, ‘5.1.3’], [‘5.2.1’, ‘5.2.2’, ‘5.2.3’], [‘5.3.1’, ‘5.3.2’, ‘5.3.3’]]];

var oneSel = document.getElementById(“One”);

var twoSel = document.getElementById(‘Two’);

var threeSel = document.getElementById(‘Three’);

var str = ”;

//下拉框一初始选项

for (var i = 0; i < oneArray.length; i++) {

str += “” + twoArray[0][i] + “”;

}

twoSel.innerHTML = str;

str = ”;

//下拉框三初始选项

for (var i = 0; i < threeArray[0].length; i++) {

str += “” + threeArray[0][0][i] + “”;

}

threeSel.innerHTML = str;

//动态改变下拉框二选项

function changeTwoSel() {

twoSel.innerHTML = ”;

str = ”;

var twoSelValue = parseInt(oneSel.value);

try {

for (var i = 0; i < twoArray[twoSelValue].length; i++) {

str += “” + threeArray[twoSelValue][threeSelValue][i] + “”;

}

} catch (ex) {

str = “无选项”;

}

threeSel.innerHTML = str;

}