日期:2014-05-16  浏览次数:20412 次

JS控制DIV隐藏显示
<a href="javascript:changeBody(1)">模块A</a> 
<a href="javascript:changeBody(2)">模块B</a> 
<a href="javascript:changeBody(3)">模块C</a> 

<div style="display: none" id="iDBody1"></div> 
<div style="display: none" id="iDBody2"></div> 
<div style="display: none" id="iDBody3"></div>
?
function changeBody(index){
  switch(index){
    case 1:{
      document.getElementById('iDBody1').style.display = "";
      document.getElementById('iDBody2').style.display = "none";
      document.getElementById('iDBody3').style.display = "none";
    }
    case 2:{
      document.getElementById('iDBody1').style.display = "none";
      document.getElementById('iDBody2').style.display = "";
      document.getElementById('iDBody3').style.display = "none";
    }
    case 3:{
      document.getElementById('iDBody1').style.display = "none";
      document.getElementById('iDBody2').style.display = "none";
      document.getElementById('iDBody3').style.display = "";
    }
  }
}

?--------------------------------------------------------

我的应用

function changeTable(str)  
	    {  
	   		var index = parseInt(str);
	    	switch(index){
		    case 0:{
		      document.getElementById('type1div').style.display = "";
		      document.getElementById('type2div').style.display = "none";
		      break;
		    }
		    case 1:{
		      document.getElementById('type2div').style.display = "";
		      document.getElementById('type1div').style.display = "none";
		      break;
		    }
		    default:{
		      document.getElementById('type1div').style.display = "";
		      document.getElementById('type2div').style.display = "none";
		      break;
		    }
		  }
?
          <table class="table_back" style="width:60%;">
            <tr>
            	<td>&nbsp;&nbsp;
            		 <select name="type" id="type" onchange="changeTable(this.options[this.options.selectedIndex].value)">
     				<%String[] types = {"机动车保有量信息","路内停车位信息"};%>
     					<option value="-请选择信息种类-" selected>-请选择信息种类-</option>
     				<% 
     				for(int i=0;i<types.length; i++){
     					String type = types[i];
     				%>
     					<option value="<%out.print(i); %>" ><%out.print(type); %></option>
     				<%
     				}
     				%>	
				     </select>&nbsp;信息种类
            	</td>
            	<td>&nbsp;&nbsp;
            		 <select name="year" id="year">
     				<%String[] years = {"2009","2010","2011","2012","2013","2014","2015","2016","2017","2018","2019","2020","2021"};
     				request.setAttribute("years",years);
     				%>	
     					<option value="-请选择年份-" selected>-请选择年份-</option>
     					<c:forEach var="year" items="${years}">
				      		<option value="${year }" >${year }</option>
				     	</c:forEach>
				     </select>&nbsp;年 
            	</td>
            	<td>&nbsp;&nbsp;
            		 <select name="month" id="month">
     				<%String[] months = {"01","02","03","04","05","06","07","08","09","10","11","12"};
     				request.setAttribute("months",months);
     				%>
     					<option value="-请选择月份-" selected>-请选择月份-</option>
     					<c:forEach var="month" items="${months}">
				      		<option value="${month }" >${month }</option>
				     	</c:forEach>
				     </select>&nbsp;月 
            	</td>
            </tr>
          </table>
         	<img src="images/sjsc.gif" width="80" height="21" border="0" onClick="MM_openBrWindow()"/>&nbsp;
          	<a href='exportExcel.action' >
   				<img src="images/sjxz.gif" width="80" height="21" border="0">
   			</a>