動態建立table

時間 2020-04-03

標籤動態建立 table 简体版

原文原文鏈接

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>javascript

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">html

<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Insert title here</title> <script type="text/javascript" src="${context}/bootstrap/js/jQuery.js"></script> <script type="text/javascript"> function add() { $("#table") .append( "<tr><td><input type='text' name='key'></td><td><input type='text' name='value'></td><td><input type='text' name='data'></td></tr>"); } function remove_line() { $("#table tr:last-child").remove(); } function getValue() { var key = ""; var value = ""; $("#table").find("tr").each(function() { $(this).find("td input").each(function() { if ($(this).attr("name") == "key") { key += $(this).val() + ","; } }); $(this).find("td input[name='value']").each(function() { value += $(this).val() + ","; }); }); console.log("key=" + key); console.log("value=" + value); } </script>java

</head> <body>bootstrap

<div>
	<input id="add" type="button" value="新增" onclick="add()"> <input
		id="delete" type="button" value="刪除" onclick="remove_line()">
	<input id="getValue" type="button" value="新增" onclick="getValue()">
</div>
<div id="table"></div>

</body> </html>app

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。