当前位置:编程学习 > html/css >>

table动态增加一行

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
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>
  <base href="<%=basePath%>">
  <title>My JSP 'tableaddrow.jsp' starting page</title>
  <meta http-equiv="pragma" content="no-cache">
  <meta http-equiv="cache-control" content="no-cache">
  <meta http-equiv="expires" content="0">
  <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
  <meta http-equiv="description" content="This is my page">
  <!--
  <link rel="stylesheet" type="text/css" href="styles.css">
  -->
  <script type="text/javascript">
  function tableAddRow(tableName)
  {
   var row = tableName.insertRow(tableName.rows.length);  //行对象
   var i = tableName.rows.length - 2; //table原有的行数
   var col;  //列对象
 
   if(tableName==tableId)
   {
    col = row.insertCell(0);
    col.innerHTML = "<input type='text' size='1' />";
    col = row.insertCell(1);
    col.innerHTML = "<input type='text' size='1' />";
    col = row.insertCell(2);
    col.innerHTML = "<input type='text' size='1' />";
    col = row.insertCell(3);
    col.innerHTML = "<input type='text' size='1' />";
   }
  }
  </script>
</head>
<body>
  <input type=button value=增加行 onclick="tableAddRow(tableId);" />

  <table id="tableId">
   <tr bgcolor="#E1F0C4">
    <td>标号</td>
    <td>姓名</td>
    <td>性别</td>
    <td>年龄</td>
   </tr>
  </table>
</body>
</html>

作者“shuxiaomeng”
 

补充:web前端 , HTML/CSS  ,
CopyRight © 2022 站长资源库 编程知识问答 zzzyk.com All Rights Reserved
部分文章来自网络,