简单的下拉菜单onchange问题

aji19810907 2014-03-26 10:24:03

<p>选择列表
<select name="select" id="xuanxiang" onchange="bian()">
<option>选项1</option>
<option>选项2</option>
<option>选项3</option>
<option>选项4</option>
<option>选项5</option>
</select>
</p>
<table width="42%" height="149" border="1">
<div id="a1"><tr><td>内容1</td><td> </td></tr></div>
<div id="a2"><tr><td>内容2</td><td> </td></tr></div>
<div id="a3"><tr><td>内容3</td><td> </td></tr></div>
<div id="a4"><tr><td>内容4</td><td> </td></tr></div>
<div id="a5"><tr><td>内容5</td><td> </td></tr></div>
</table>
<p> </p>
</body>
</html>
<script language="javascript">
var zhi=document.getElementById("xuanxiang").value;
var zhi1=zhi.options[zhi.selectedIndex].value;
var a1=document.getElementById("a1");
var a2=document.getElementById("a2");
var a3=document.getElementById("a3");
var a4=document.getElementById("a4");
var a5=document.getElementById("a5");
function bian(){
if (zhi1=="选项1" or zhi1=="选项2")
{
a3.style.display='none';
a4.style.display='none';
a5.style.display='none';
}
else if (zhi1=="选项3")
{
a5.style.display='none';
}
else
{

}

}
</script>

...全文

119 2 打赏收藏转发到动态举报

写回复

用AI写文章

2 条回复

切换为时间正序

请发表友善的回复…

发表回复

嘻哈大咖秀 2014-03-26

打赏
举报

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8" />
	<title></title>
	<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
</head>

<body>
	
	<p>选择列表
		<select name="select" id="xuanxiang" onchange="bian()">
			<option>选项1</option>
			<option>选项2</option>
			<option>选项3</option>
			<option>选项4</option>
			<option>选项5</option>
		</select>
	</p>
	<table width="42%" height="149" border="1">
		<tr id="a1"><td>内容1</td><td> </td></tr>
		<tr id="a2"><td>内容2</td><td> </td></tr>
		<tr id="a3"><td>内容3</td><td> </td></tr>
		<tr id="a4"><td>内容4</td><td> </td></tr>
		<tr id="a5"><td>内容5</td><td> </td></tr>
	</table>
	<p> </p>
	<script language="JavaScript">
		
		var a1=document.getElementById("a1");
		var a2=document.getElementById("a2");
		var a3=document.getElementById("a3");
		var a4=document.getElementById("a4");
		var a5=document.getElementById("a5");
		function bian(){
			var zhi=document.getElementById("xuanxiang");
				var zhi1=zhi.options[zhi.selectedIndex].value;
				
			if (zhi1=="选项1" || zhi1=="选项2")
			{
				
				//alert(zhi1);
				a3.style.display="none";
				a4.style.display='none';
				a5.style.display='none';
			}
			else if (zhi1=="选项3")
			{
				a5.style.display='none';
			}
			else
			{

			}

		}
	</script>
</body>
</html>

人生难得一只鸡 2014-03-26

打赏
举报

js逻辑错误，标签嵌套不规范，一系列的问题，如下修改，运行看看

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="textml; charset=utf-8" />
<title>无标题文档</title>
<style>

</style>
<script>

</script>
</head>

<body>


<p>选择列表
  <select name="select" id="xuanxiang" onchange="bian()">
    <option>选项1</option>
    <option>选项2</option>
    <option>选项3</option>
    <option>选项4</option>
    <option>选项5</option>
  </select>
</p>
<div id="a1"><tr><td>内容1</td><td> </td></tr></div>
<div id="a2"><tr><td>内容2</td><td> </td></tr></div>
<div id="a3"><tr><td>内容3</td><td> </td></tr></div>
<div id="a4"><tr><td>内容4</td><td> </td></tr></div>
<div id="a5"><tr><td>内容5</td><td> </td></tr></div>
<p> </p>
</body>
</html>
<script language="javascript">


var a1=document.getElementById("a1");
var a2=document.getElementById("a2");
var a3=document.getElementById("a3");
var a4=document.getElementById("a4");
var a5=document.getElementById("a5");
function bian(){
	var zhi=document.getElementById("xuanxiang");
	var zhi1=zhi.options[zhi.selectedIndex].value;
if (zhi1=="选项1" || zhi1=="选项2")
  {
  a3.style.display='none';
  a4.style.display='none';
  a5.style.display='none';
  }
else if (zhi1=="选项3")
  {
  a5.style.display='none';
  }
else
  {
 
  }

}
</script>
</body>
<html>

asp如何实现动态下拉菜单赋值给文本框的两种方式。

简单DWR动态下拉菜单

重新定义的select视觉样式突破select下来框的默认样式不能修改的困境

select2 下拉搜索级联全国省市区的三级联动谢谢

内容：包含实验报告、可直接执行的程序、源码功能：利用软件开发工具（javascript），开发一个下拉式菜单与通用对话框。