火狐下动态表格的问题
代码如下:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.
<html xmlns="http://www.
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<script language="JavaScript">
String.prototype.trim = function()
{
// 用正则表达式将前后空格,用空字符串替代。
//用法 a.trim()
return this.replace(/(^\s*)|(\s*$)/g, "");
}
function doAdd()
{
var myTable = document.getElementById("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.getElementById("addrow").value;
if (!(insertRows =="" || insertRows =="0"))
{
for (var i=0;i<insertRows;i++)
doAdd();
}
}
function dodelete()
{
var myTable = document.getElementById("myTable");
var rows = myTable.rows.length;
if(rows>2)
myTable.deleteRow(rows-1);
}
</script>
<table width="520" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="100" align="right" height="30">Item Number:</td>
<td width="130" ><input style="height:20px;width:120px;" /></td>
<td width="130" align="right">Company:</td>
<td width="160" ><input style="height:20px;width:120px;" /></td>
</tr>
<tr>
<td align="right" height="30">Project Type:</td>
<td><input style="height:20px;width:120px;" /></td>
<td align="right">Project:</td>
<td><input style="height:20px;width:120px;" /></td>
</tr>
<tr>
<td align="right" height="30">Leader:</td>
<td><input style="height:20px;width:120px;" /></td>
<td align="right">Amount:</td>
<td><input style="height:20px;width:120px;" /></td>
</tr>
<tr>
<td align="right" height="30">Telephone:</td>
<td><input style="height:20px;width:120px;" /></td>
<td align="right">Emal:</td>
<td><input style="height:20px;width:120px;" /></td>
</tr>
<tr>
<td align="right" height="30">MSN:</td>
<td><input style="height:20px;width:120px;" /></td>
<td align="right">FAX:</td>
<td><input style="height:20px;width:120px;" /></td>
</tr>
<tr>
<td align="right" height="30">Start Time:</td>
<td><input style="height:20px;width:120px;" /></td>
<td align="right">Completion time:</td>
<td><input style="height:20px;width:120px;" /></td>
</tr>
<tr>
<td align="right" height="30">actual start time:</td>
<td><input style="height:20px;width:120px;" /></td>
<td align="right">Actual completion time:</td>
<td><input style="height:20px;width:120px;" /></td>
</tr>
<tr>
<td colspan="4" align="center" height="25">Task details</td>
</tr>
<tr>
<td colspan="4"> <table width="520" border="0" cellspacing="0" cellpadding="0" id="myTable">
<tr>
<td align="center" height="25" width="100">No.</td>
<td align="center" width="130">Task</td>
<td align="center" width="130">Acceptance Time</td>
<td align="center" width="160">Notes</td>
</tr>
<tr>
<td><div style="width:100px;height:30px;text-align:center;"><input style="height:20px;width:60px;margin-top:4px;" /></div></td>
<td><input style="height:20px;width:120px;" /></td>
<td><input style="height:20px;width:120px;" /></td>
<td><input style="height:20px;width:120px;" /></td>
</tr>
</table>
<table width="520" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="100" align="center"><input type="button" name="add" value="add a row" onClick="doAdd();"></td>
<td width="260" align="center"><input type="text" name="addrow" id="addrow" value="" style="width:80px;height:20px;"> <input type="button" name="numberrow" value="add the number of row" onClick="doAddBatRows();"></td>
<td width="160" align="center"><input type="button" name="del" value="delete a row" onClick="dodelete();"></td>
</tr>
</table>
<table width="520" border="0" cellspacing="0" cellpadding="0">
<tr>
<td colspan="4" align="center" height="30"><input type="submit" value="提交"/></td>
</tr>
</table></td>
</tr>
</table>
</body>
</html>
各位大侠,上面这段代码是利用js实现表格增加删除行的,ie下可以用,但是火狐下不能用啊,请高手帮忙看看,谢谢!
[ 本帖最后由 cmj313599019 于 2009-10-27 10:54 编辑 ]