<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<script language="JavaScript">
String.prototype.trim = function()
{
// 用正则表达式将前后空格,用空字符串替代。
//用法 a.trim()
return this.replace(/(^/s*)|(/s*$)/g, "");
}
function doAdd()
{
var myTable = document.all.myTable;
var currentRows = myTable.rows.length;//原来的行数
var atr = myTable.rows[currentRows-1];
var insertTr = myTable.insertRow(currentRows);
var trStr = atr.innerHTML; //表格最后一行的html代码
var trhtmlArray = trStr.split("<TD>");
var cols = myTable.rows[0].children.length;//总共列数
//alert(atr.innerHTML);
//alert(cols);
//alert("数组长度="+trhtmlArray.length);
for(var i=0;i<cols;i++)
{
var insertTd = insertTr.insertCell(i);
var tdHtml = trhtmlArray[i+1];//split函数得到了比cols多一个长度
//alert(tdHtml);
//alert(tdHtml.trim().length);
tdHtml = tdHtml.trim().substr(0, (tdHtml.trim().length-5));
//alert(tdHtml);
insertTd.innerHTML = tdHtml;
}
//清除值
for(var i=0;i<cols;i++)
{
var TdElementsCount = myTable.rows[currentRows].children[i].children.length;
if(i==0)
{
var rowNumber = myTable.rows.length-1;
//alert(rowNumber);
myTable.rows[currentRows].children[0].children[0].value = rowNumber;
}
else
{
for(var j=0;j<TdElementsCount;j++)
{
if(myTable.rows[currentRows].children[i].children[j].tagName == "SELECT")
myTable.rows[currentRows].children[i].children[j].selectedIndex = 0;
else
myTable.rows[currentRows].children[i].children[j].value = "";
}
}
}
}
function doAddBatRows()
{
var insertRows = document.all.插入行数.value.trim();
if (!(insertRows =="" || insertRows =="0"))
{
for (var i=0;i<insertRows;i++)
doAdd();
}
}
function dodelete()
{
var myTable = document.all.myTable;
var rows = myTable.rows.length;
if(rows>2)
myTable.deleteRow(rows-1);
}
</script>
<BODY>
<form>
<table id="myTable" border="1" align="center">
<TR align="center" height="20">
<td width="20%">
序号
</td>
<td width="20%">
01
</td>
<td width="20%">
02
</td>
<td width="20%">
03
</td>
<td width="20%">
04
</td>
</TR>
<TR>
<td>
<input type="text" name="id001" value="1" readonly=true>
</td>
<td>
<input type="hidden" name="id010" value="1">
<input type="text" name="id011" value="">
</td>
<td>
<input type="hidden" name="id020" value="1">
<select name="select">
<option value="male">男</option>
<option value="female">女</option>
</select>
</td>
<td>
<input type="hidden" name="id030" value="1">
<input type="text" name="id031" value="">
</td>
<td>
<input type="hidden" name="id040" value="1">
<input type="text" name="id041" value="" οnclick="alert();">
</td>
</TR>
</table>
<br>
<input type="button" name="新增一行" value="新增一行" οnclick="doAdd();">
<br>
<input type="text" name="插入行数" value="">
<input type="button" name="新增多行" value="新增多行" οnclick="doAddBatRows();">
<br>
<input type="button" name="删除一行" value="删除一行" οnclick="dodelete();">
</form>
</BODY>
</HTML>
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<script language="JavaScript">
String.prototype.trim = function()
{
// 用正则表达式将前后空格,用空字符串替代。
//用法 a.trim()
return this.replace(/(^/s*)|(/s*$)/g, "");
}
function doAdd()
{
var myTable = document.all.myTable;
var currentRows = myTable.rows.length;//原来的行数
var atr = myTable.rows[currentRows-1];
var insertTr = myTable.insertRow(currentRows);
var trStr = atr.innerHTML; //表格最后一行的html代码
var trhtmlArray = trStr.split("<TD>");
var cols = myTable.rows[0].children.length;//总共列数
//alert(atr.innerHTML);
//alert(cols);
//alert("数组长度="+trhtmlArray.length);
for(var i=0;i<cols;i++)
{
var insertTd = insertTr.insertCell(i);
var tdHtml = trhtmlArray[i+1];//split函数得到了比cols多一个长度
//alert(tdHtml);
//alert(tdHtml.trim().length);
tdHtml = tdHtml.trim().substr(0, (tdHtml.trim().length-5));
//alert(tdHtml);
insertTd.innerHTML = tdHtml;
}
//清除值
for(var i=0;i<cols;i++)
{
var TdElementsCount = myTable.rows[currentRows].children[i].children.length;
if(i==0)
{
var rowNumber = myTable.rows.length-1;
//alert(rowNumber);
myTable.rows[currentRows].children[0].children[0].value = rowNumber;
}
else
{
for(var j=0;j<TdElementsCount;j++)
{
if(myTable.rows[currentRows].children[i].children[j].tagName == "SELECT")
myTable.rows[currentRows].children[i].children[j].selectedIndex = 0;
else
myTable.rows[currentRows].children[i].children[j].value = "";
}
}
}
}
function doAddBatRows()
{
var insertRows = document.all.插入行数.value.trim();
if (!(insertRows =="" || insertRows =="0"))
{
for (var i=0;i<insertRows;i++)
doAdd();
}
}
function dodelete()
{
var myTable = document.all.myTable;
var rows = myTable.rows.length;
if(rows>2)
myTable.deleteRow(rows-1);
}
</script>
<BODY>
<form>
<table id="myTable" border="1" align="center">
<TR align="center" height="20">
<td width="20%">
序号
</td>
<td width="20%">
01
</td>
<td width="20%">
02
</td>
<td width="20%">
03
</td>
<td width="20%">
04
</td>
</TR>
<TR>
<td>
<input type="text" name="id001" value="1" readonly=true>
</td>
<td>
<input type="hidden" name="id010" value="1">
<input type="text" name="id011" value="">
</td>
<td>
<input type="hidden" name="id020" value="1">
<select name="select">
<option value="male">男</option>
<option value="female">女</option>
</select>
</td>
<td>
<input type="hidden" name="id030" value="1">
<input type="text" name="id031" value="">
</td>
<td>
<input type="hidden" name="id040" value="1">
<input type="text" name="id041" value="" οnclick="alert();">
</td>
</TR>
</table>
<br>
<input type="button" name="新增一行" value="新增一行" οnclick="doAdd();">
<br>
<input type="text" name="插入行数" value="">
<input type="button" name="新增多行" value="新增多行" οnclick="doAddBatRows();">
<br>
<input type="button" name="删除一行" value="删除一行" οnclick="dodelete();">
</form>
</BODY>
</HTML>