jquery添加行列
jquery添加行列
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>
无标题页
</title>
<script language="Javascript" src="jquery/jquery.js" type="text/javascript"></script>
</head>
<body>
<label>
<input type="button" name="button" id="button" value="加列" onclick="AddLie();" />
<input type="button" name="button" id="button" value="加行" onclick="AddHang();" />
<input type="button" name="button" id="button" value="减列" onclick="JianLie();" />
<input type="button" name="button" id="button" value="减行" onclick="JianHang();" />
<input type="button" name="button" id="button" value="kandaima" onclick="kandaima();" />
</label>
<table border="0" style="border-collapse:collapse">
<tr>
<td><input name="Xname" type="text" id="Xname" size="10" value="数据标签" /></td>
<td><input name="Series1" type="text" id="Series1" value="系列名1" size="10"/></td>
</tr>
<tr>
<td><input name="Xname" type="text" id="Xname" size="10" value="标签1" /></td>
<td><input name="Series1" type="text" id="Series1" size="10" value="数值1"/></td>
</tr>
</table>
<script type="text/javascript">
function JianHang()
{
$("tr:last").remove();
}
function JianLie()
{
$("tr td:last-child").remove();
}
function AddHang()
{
$("tr:first").clone().appendTo("table:first");
$("tr:last td input").val("");
}
function AddLie()
{
var Num=$("tr:first td").size();
$("tr").append("<td><input name="Series"+Num+"" type="text" id="Series"+Num+"" size="10"/></td>");
$("tr:first td:last input").val("系列名"+Num);
}
function kandaima()
{ alert($("table:first").html());
}
</script>
</body>
</html>
