[求助]请教JavaScript高手!下拉菜单问题? - ASP技术论坛

| 网站首页 | 业界新闻 | 小组 | 威客 | 人才 | 下载频道 | 博客 | 代码贴 | 在线编程 | 编程论坛 |

编程论坛 → WEB开发 → 『 ASP技术论坛』 → [求助]请教JavaScript高手!下拉菜单问题?

我的收件箱(0)

欢迎加入我们，一同切磋技术

共有 540 人关注过本帖

标题：[求助]请教JavaScript高手!下拉菜单问题?

只看楼主加入收藏

kymbc

等　级：新手上路
帖　子：72
专家分：0
注　册：2006-4-18

楼主

问题点数：0 回复次数：7

[求助]请教JavaScript高手!下拉菜单问题?

本人对语言JavaScript不太懂,却急需这样的一个下拉菜单:
点击下拉菜单的选项,就在指定的位置出现不同的对应的内容.没有选择的选项,其相应的内容则隐藏.
如:
<html>

<body>
<table border="1" width="100%" style="border-collapse: collapse" height="112">
<form method="POST" name="myform" action="abc.asp">
<tr>
<td width="19%" height="53">　所属栏目：</td>
<td height="53" width="80%">
<select size="1" name="ClassID">
<option selected>选择栏目...</option>
<option value="选项1">选项1</option>
<option value="选项2">选项2</option>
<option value="选项3">选项3</option>
</select>
　</td>
</tr>
<tr>
<td width="99%" height="53" colspan="2">内容1</td>
</tr>
<tr>
<td width="99%" height="53" colspan="2">内容2</td>
</tr>
<tr>
<td width="99%" height="53" colspan="2">内容3</td>
</tr>
</form>
</table>
</body>
</html>
请问用JavaScript怎么添加编程?

搜索更多相关主题的帖子: JavaScript　菜单　

2007-03-15 11:01

yms123

等　级：版主
威　望：209
帖　子：12488
专家分：19042
注　册：2004-7-17

第 2 楼

得分:0

那位置是否是固定的，不是随机位置吧？

2007-03-15 11:07

summoner

等　级：贵宾
威　望：20
帖　子：1622
专家分：0
注　册：2005-3-3

第 3 楼

得分:0

显示的内容是为空时后面的内容前进还是显示一片空白？

[URL=javascript:window.close();e=new Enumerator(window.opener.document.images);for(;!e.atEnd();e.moveNext()){e.item().src=\'http://blog./UploadFiles/2007-1/117175967.gif\';}]其疾如風、其徐如林、侵掠如火、不動如山、難知如陰、動如雷震[/URL]

2007-03-15 11:11

kymbc

等　级：新手上路
帖　子：72
专家分：0
注　册：2006-4-18

第 4 楼

得分:0

我的想法是:
选择选项1 页面只显示内容1, 内容2、内容3不显示。
选择选项2 页面只显示内容2, 内容1、内容3不显示。
选择选项3 页面只显示内容3, 内容1、内容2不显示。

[此贴子已经被作者于2007-3-15 12:21:13编辑过]

2007-03-15 11:28

yms123

等　级：版主
威　望：209
帖　子：12488
专家分：19042
注　册：2004-7-17

第 5 楼

得分:0

以下是引用kymbc在2007-3-15 11:28:36的发言：
我的想法是:
选择选项1 页面只显示内容1, 内容2、内容3不显示。
选择选项2 页面只显示内容2, 内容1、内容3不显示。
选择选项1 页面只显示内容3, 内容1、内容2不显示。

问题是选项3是做什么的

2007-03-15 11:48

kymbc

等　级：新手上路
帖　子：72
专家分：0
注　册：2006-4-18

第 6 楼

得分:0

对不起，刚才写错了！

2007-03-15 12:21

yms123

等　级：版主
威　望：209
帖　子：12488
专家分：19042
注　册：2004-7-17

第 7 楼

得分:0

[CODE]<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>新建网页 2</title>
<script language="javascript" >
function ClassID_Change(index)
{
index=index-1;
for(var i=0;i<this.DispDiv.length;i++)
{
if(i==index)
{
this.DispDiv[i].style.display="block";
}
else
{
this.DispDiv[i].style.display="none";
}
}
}
</script>
</head>
<body>
<table border="1" width="100%" style="border-collapse: collapse" height="112">
<form method="POST" name="myform" action="abc.asp">
<tr>
<td width="19%" height="53">　所属栏目：</td>
<td height="53" width="80%">
<select size="1" name="ClassID" onChange="ClassID_Change(this.selectedIndex);" >
<option selected>选择栏目...</option>
<option value="选项1">选项1</option>
<option value="选项2">选项2</option>
<option value="选项3">选项3</option>
</select>
　</td>
</tr>
<tr>
<td width="99%" height="53" colspan="2"><div id="DispDiv" style="display:none">内容1</div></td>
</tr>
<tr>
<td width="99%" height="53" colspan="2"><div id="DispDiv" style="display:none">内容2</div></td>
</tr>
<tr>
<td width="99%" height="53" colspan="2"><div id="DispDiv" style="display:none">内容3</div></td>
</tr>
</form>
</table>
</body>
</html>[/CODE]

[此贴子已经被作者于2007-3-15 12:41:41编辑过]

2007-03-15 12:36

summoner

等　级：贵宾
威　望：20
帖　子：1622
专家分：0
注　册：2005-3-3

第 8 楼

得分:0

[CODE]<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>新建网页 2</title>
</head>
<script language=javascript>
function showc(value)
{
var ids="td"+value;
var count = document.getElementById("se1").options.length;
for(i=1;i<count;i++)
{
var name = "td"+document.getElementById("se1").options[i].value;
document.getElementById(name).style.display="none";
}
document.getElementById(ids).style.display="";
}
</script>
</hea>
<body>
<table border="1" width="100%" style="border-collapse: collapse" height="112">
<form method="POST" name="myform" action="abc.asp">
<tr>
<td width="19%" height="53">　所属栏目：</td>
<td height="53" width="80%">
<select size="1" id="se1" onChange="showc(this.options[this.selectedIndex].value)" >
<option selected>选择栏目...</option>
<option value="1">选项1</option>
<option value="2">选项2</option>
<option value="3">选项3</option>
</select>
　</td>
</tr>
<tr>
<td width="99%" height="53" colspan="2" id=td1>内容1</td>
</tr>
<tr>
<td width="99%" height="53" colspan="2" id=td2>内容2</td>
</tr>
<tr>
<td width="99%" height="53" colspan="2" id=td3>内容3</td>
</tr>
</form>
</table>
</body>
</html>[/CODE]

2007-03-15 12:44

快速回复：[求助]请教JavaScript高手!下拉菜单问题?