tab 的实现

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@taglib prefix="s" uri="/struts-tags"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>调运单详细</title>
		<script type="text/javascript">
		  function tab1(){
		   document.getElementById("tab1").style.display='block';
		   document.getElementById("tab2").style.display='none';
		  }
		  function tab2(){
		   document.getElementById("tab2").style.display='block';
		   document.getElementById("tab1").style.display='none';
		  }
		</script>
	</head>
	  <table>
	      <tr>
	         <td onclick="tab1()">tab1</td>
	         <td onclick="tab2()">tab2</td>
	      </tr>
	      <tr style="display:block" id="tab1">
	         <td colspan=2>
	         <fieldset>
	         <legend>tab1</legend>
	            <form action="">
	               <table>
	                  <tr>
	                     <th>第一行</th><td><input type="text" name="username"></td> 
	                     <th>第二列</th><td><input type="text" name="pwd"></td>
	                  </tr>
	                  <tr>
	                     <th>第二行</th><td><input type="text" name="username"></td> 
	                     <th>第二列</th><td><input type="text" name="pwd"></td>
	                  </tr>
	                  <tr>
	                     <td><input type="submit" value="确定" /></td> <td><input type="reset" value="取消"/></td> 
	                  </tr>
	               </table>
	            </form>
	            </fieldset>
	         </td>
	      </tr>
	      <tr style="display:none" id="tab2">
	         <td colspan=2>
	          <fieldset>
	         <legend>tab2</legend>
	            <form action="">
	               <table>
	                  <tr >
	                     <th>tab2第一行</th><td><input type="text" name="username"></td> 
	                     <th>第二列</th><td><input type="text" name="pwd"></td>
	                  </tr>
	                  <tr>
	                     <th>tab2第二行</th><td><input type="text" name="username"></td> 
	                     <th>第二列</th><td><input type="text" name="pwd"></td>
	                  </tr>
	                  <tr>
	                     <td><input type="submit" value="确定" /></td> <td><input type="reset" value="取消"/></td> 
	                  </tr>
	               </table>
	            </form>
	            </fieldset>
	         </td>
	      </tr> 
	  </table>
	   	
</html>

 

你可能感兴趣的:(JavaScript,html,struts)