`
rainShare
  • 浏览: 100021 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

多维下拉框的测试

    博客分类:
  • WEB
阅读更多
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=uft-8" />
		<title>测试多维下拉列表</title>
		<script type="text/javascript">
			
			var arrUnit = new Array();
			arrUnit[0] = new Array(0,"u01","unit1");
			arrUnit[1] = new Array(0,"u02","unit2");
			
			var arrDept = new Array();
			arrDept[0] = new Array("u01","d01","department1");
			arrDept[1] = new Array("u01","d02","department2");
			arrDept[2] = new Array("u02","d03","department3");
			arrDept[3] = new Array("u02","d04","department4");
			
			var arrEmp = new Array();
			arrEmp[0] = new Array("d01","e01","employee1");
			arrEmp[1] = new Array("d02","e02","employee2");
			arrEmp[2] = new Array("d03","e03","employee3");
			arrEmp[3] = new Array("d04","e04","employee4");
			arrEmp[4] = new Array("d03","e05","employee5");
			arrEmp[5] = new Array("d04","e06","employee6");
			
			function body_onload()
			{
				var TD = GetParent(document.all("s0"), "TD");
				TD.innerHTML = MakeMenu(arrUnit, 0, 0, "s0", 1);
				
				TD = GetParent(document.all("s1"), "TD");
				TD.innerHTML = MakeMenu(arrDept, GetSelectValue(document.all("s0")), 0, "s1", 1);
				
				TD = GetParent(document.all("s2"), "TD");
				TD.innerHTML = MakeMenu(arrEmp, GetSelectValue(document.all("s1")), 0, "s2", 1);
				
			}
			
			function GetParent(src, tag)
			{
				if (src && src.tagName != tag)
				{
				   return(GetParent(src.parentElement, tag));
				}
				return src;
			}

			function GetSelectValue(oSelect)
			{
				if (oSelect.selectedIndex < 0) 
					return 0;	
				return oSelect.options(oSelect.selectedIndex).value;
			}

			function MakeMenu(arrSub, pValue, cValue, name, bulSkip)
			{
				var sHTML = "<select name='" + name + "' onchange='SetSubmenu(this)' >";
				if(bulSkip) sHTML += "<option value=0>please select</option>";
				for(var i=0; i < arrSub.length; i++)
				{
				   if (arrSub[i][0]==pValue)
				   {
				      var tag = (arrSub[i][1]==cValue)?" selected>":">";
				      sHTML += "<option value='" + arrSub[i][1] + "'" + tag + arrSub[i][2] + "</option>";
				   }
				}
				sHTML += "</select>";
				return sHTML;
			}

			
			function SetSubmenu(pSelect)
			{
				var oOption, sValue;
				if (pSelect.selectedIndex < 0) return;
				   switch (pSelect.name)
				   {
				     case "s0":
					 	//TD=s1
				     	var TD = GetParent(document.all("s1"), "TD");				     	TD.innerHTML = MakeMenu(arrDept, GetSelectValue(document.getElementById("s0")), "0", "s1", 0);
						//TD=s2
						TD = GetParent(document.all("s2"), "TD");
				     	TD.innerHTML = MakeMenu(arrEmp, GetSelectValue(document.getElementById("s1")), "0", "s2", 0);
						break;
					case "s1":
				      	var TD = GetParent(document.all("s2"), "TD");
				      	TD.innerHTML = MakeMenu(arrEmp, GetSelectValue(document.getElementById("s1")), "0", "s2", 0);
				       	break; 
				     default:
					}
			}
		</script>
	</head>
	<body onload="body_onload()">
	   <TABLE>
		<TR>
		<TD>
			<SELECT id="s0" name="s0" onchange="SetSubmenu(this)"></SELECT>
		</TD>
		<TD>
			<SELECT id="s1" name="s1" onchange="SetSubmenu(this)"></SELECT>
		</TD>
		<TD>
			<SELECT id="s2" name="s2" onchange="SetSubmenu(this)"></SELECT>
		</TD>
		</TR>
	  </TABLE>
	</body>
</html>



分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics