| 网站首页 | 业界新闻 | 小组 | 威客 | 人才 | 下载频道 | 博客 | 代码贴 | 在线编程 | 编程论坛
欢迎加入我们,一同切磋技术
用户名:   
 
密 码:  
共有 637 人关注过本帖
标题:火狐下动态表格的问题
只看楼主 加入收藏
cmj313599019
Rank: 1
等 级:新手上路
帖 子:2
专家分:0
注 册:2009-10-27
收藏
 问题点数:0 回复次数:0 
火狐下动态表格的问题
代码如下:
<!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;">&nbsp;<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 编辑 ]
搜索更多相关主题的帖子: 动态 表格 火狐 
2009-10-27 10:23
快速回复:火狐下动态表格的问题
数据加载中...
 
   



关于我们 | 广告合作 | 编程中国 | 清除Cookies | TOP | 手机版

编程中国 版权所有,并保留所有权利。
Powered by Discuz, Processed in 0.046510 second(s), 7 queries.
Copyright©2004-2024, BCCN.NET, All Rights Reserved