87,907
社区成员
发帖
与我相关
我的任务
分享小妹求助2，下拉菜单的触发如何实现！
我想做一个这样的效果：点击下拉菜单的第一项，右边出现文本输入框；点击第二项，右边出现另一个下拉菜单；点击第三项，右边什么也不出；呵呵！
请问高手们，如何实现呢？谢谢大家！
请问高手们，如何实现呢？谢谢大家！
...全文
请发表友善的回复…
发表回复
dragonlyf 2005-03-09
- 打赏
- 举报
csdn搜索 “联动菜单”，保你有意想不到的结果
lpn 2005-03-09
- 打赏
- 举报
谢谢大家，我试试先！
vivianfdlpw 2005-03-08
- 打赏
- 举报
<style>
select{t:expression(this.onclick=function(){show(this)})}
</style>
<script>
function show(obj)
{
var selectedIndex=0;
var td=document.getElementsByTagName('td')[1];
for(var i=0;i<obj.options.length;i++)
{
if(obj.options[i].value==obj.value)
{selectedIndex=i;break;}
}
if(selectedIndex!=2)
{
if(selectedIndex==0)
{
td.innerHTML='<input type=text id=txt>';
}
else
{
td.innerHTML='<select><option>新菜单</option></select>';
}
}
else
td.innerHTML='';
}
</script>
<body>
<table><tr>
<td>
<select name='sel'>
<option value='1'>1</option>
<option value='2'>2</option>
<option value='3'>3</option>
</td>
<td></td>
</tr></table>
</body>
select{t:expression(this.onclick=function(){show(this)})}
</style>
<script>
function show(obj)
{
var selectedIndex=0;
var td=document.getElementsByTagName('td')[1];
for(var i=0;i<obj.options.length;i++)
{
if(obj.options[i].value==obj.value)
{selectedIndex=i;break;}
}
if(selectedIndex!=2)
{
if(selectedIndex==0)
{
td.innerHTML='<input type=text id=txt>';
}
else
{
td.innerHTML='<select><option>新菜单</option></select>';
}
}
else
td.innerHTML='';
}
</script>
<body>
<table><tr>
<td>
<select name='sel'>
<option value='1'>1</option>
<option value='2'>2</option>
<option value='3'>3</option>
</td>
<td></td>
</tr></table>
</body>
redtank2005 2005-03-08
- 打赏
- 举报
<html>
<head>
<title>无标题文档</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
</head>
<body>
<form action=''>
<td>
<select name="QueryTerm" onchange="javascript:if (this.value == '1') {document.all('select').style.display = '' ;document.all('textfield').style.display = 'none' ;}else if (this.value == '2') {document.all('select').style.display = 'none';document.all('textfield').style.display = '' ;}else{document.all('select').style.display = 'none';document.all('textfield').style.display = 'none' ;}">
<option value="1">1</option>
<option value="2">2</option>
<option value="3" selected>3</option>
</select>
<select name="select" id="kan1" style="display: none" >
<option value="1">1</option>
<option value="2">2</option>
</select>
<input type="text" name="textfield" id="kan2" style="display: none" ></td>
</tr>
</form>
</body>
</html>
<head>
<title>无标题文档</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
</head>
<body>
<form action=''>
<td>
<select name="QueryTerm" onchange="javascript:if (this.value == '1') {document.all('select').style.display = '' ;document.all('textfield').style.display = 'none' ;}else if (this.value == '2') {document.all('select').style.display = 'none';document.all('textfield').style.display = '' ;}else{document.all('select').style.display = 'none';document.all('textfield').style.display = 'none' ;}">
<option value="1">1</option>
<option value="2">2</option>
<option value="3" selected>3</option>
</select>
<select name="select" id="kan1" style="display: none" >
<option value="1">1</option>
<option value="2">2</option>
</select>
<input type="text" name="textfield" id="kan2" style="display: none" ></td>
</tr>
</form>
</body>
</html>
