下面是个动态的下拉菜单,在A选单内选择主分类后B选单会列出对应的子级菜单。
把<Script language=JavaScript>......</Script>内的程序放入<head>.....</head>之间:
<SCRIPT language=JavaScript>
SubMenuinfo = new Array(
new Array(
new Array("产品1-1", 39482304),
new Array("产品1-2", 34802389),
new Array("产品1-3", 39823498),
new Array("产品1-4", 87587343),
new Array("产品1-5", 68798735),
new Array("产品1-6", 98098509),
new Array("产品1-7", 49490583),
new Array("产品1-8", 32898334),
new Array("产品1-9", 92340934),
new Array("产品1-10", 34923409),
new Array("产品1-11", 59384093)
),
new Array(
new Array("产品2-1", 23840238),
new Array("产品2-2", 92390484),
new Array("产品2-3", 29048203),
new Array("产品2-4", 94098230),
new Array("产品2-5", 39234923),
new Array("产品2-6", 29345423),
new Array("产品2-7", 24890234),
new Array("产品2-8", 92349823)
),
null,
//主分类3没有子分类,用null;
new Array(
new Array("产品4-1", 20394802),
new Array("产品4-2", 34982039),
new Array("产品4-3", 92348902),
new Array("产品4-4", 98203894),
new Array("产品4-5", 98234902),
new Array("产品4-6", 52938409)
)
);
function fillSelectFromArray(selectCtrl, itemArray, goodPrompt, badPrompt, defaultItem) {
var i, j;
var prompt;
for (i = selectCtrl.options.length; i >= 0; i--) {
selectCtrl.options[i] = null;
}
prompt = (itemArray != null) ? goodPrompt : badPrompt;
if (prompt == null) {
j = 0;
}
else {
selectCtrl.options[0] = new Option(prompt);
j = 1;
}
if (itemArray != null) {
for (i = 0; i < itemArray.length; i++) {
selectCtrl.options[j] = new Option(itemArray[i][0]);
if (itemArray[i][1] != null) {
selectCtrl.options[j].value = itemArray[i][1];
}
j++;
}
selectCtrl.options[0].selected = true;
}
}
</SCRIPT>
在表单内加入下列内容:
<form name="main" method="post" action="collect.asp" target="_blank">
<div align="center">
<select
onChange="fillSelectFromArray(this.form.SubMenu, ((this.selectedIndex == -1) ? null : SubMenuinfo[this.selectedIndex-1]));" name=MainMenu class="menu">
<option value=-1 selected>选择产品分类
<option value="分类1">产品分类1
<option value="分类2">产品分类2
<option value="分类3">产品分类3
<option value="分类4">产品分类4 </option>
</select>
<select size=1 name=SubMenu class="menu">
<option>---------------</option>
<option></option>
<option></option>
<option></option>
<option></option>
</select>
<input type="submit" value="Submit it" name="submit">
</div>
</form>
……