点击按钮增加一行表格

最新推荐文章于 2024-09-13 09:46:13 发布

置顶聆听HJ

最新推荐文章于 2024-09-13 09:46:13 发布

阅读量2.1w

点赞数 8

分类专栏：表单表格文章标签： jsp

本文链接：https://blog.csdn.net/weixin_41542329/article/details/78903675

版权

表单表格专栏收录该内容

2 篇文章 0 订阅

订阅专栏

点击按钮增加一行表格

做此功能我们要用到两个方法：

insertRow()： insertRow() 方法用于在表格中的指定位置插入一个新行。

insertCell() ：insertCell() 方法用于在 HTML 表的一行的指定位置插入一个空的 <td> 元素。

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<script type="text/javascript">
var i=0
function insert_row(){
	 i ++
	 R = tbl.insertRow() //insertRow() 方法用于在表格中的指定位置插入一个新行。
	 C = R.insertCell()  //insertCell() 方法用于在 HTML 表的一行的指定位置插入一个空的 <td> 元素。
	 C.innerHTML = "<select>"+
	 "<option value='法定代表人' name='name'>法定代表人</option>"+
	 "<option value='登记机关' name='regorgCn'>登记机关</option>"+
	 "<option value='电子邮箱' name='email'>电子邮箱</option>"+
	 "<option value='经营范围' name='opscope'>经营范围</option>"+
	 "<option value='住所' name='dom'>住所</option>"+
	 "<option value='联系电话' name='tel'>联系电话</option>"+
	 "<option value='注销日期' name='candate'>注销日期</option>"+
	 "<option value='吊销日期' name='date'>吊销日期</option>"+
	 "</select>"
	
	 C = R.insertCell()
	 C.innerHTML = "<input id='mytext' style='text-align:left;width:400px'/>"
	 C = R.insertCell()
	 C.innerHTML = "<input type='button'  value='删除' οnclick='deleteRow(this)'>"
}
function deleteRow(obj){
	 alert("确定删除第"+(obj.parentElement.parentElement.rowIndex+1)+"行吗？");
	 tbl.deleteRow(obj.parentElement.parentElement.rowIndex);
}
</script>
<body>
	<div>
		<table width="80%" name='tbl' id="tbl" border="0" align="center">
					
		</table>
	</div>
	<input type="button" value="添加" οnclick="insert_row()"/>
</body>
</html>