Lengzihaohong

学无止境(专注于DotNet技术)
  博客园  :: 首页  :: 新随笔  :: 联系 :: 订阅 订阅  :: 管理

javascript动态增加、删除、填充表格内容

Posted on 2007-03-19 11:29  神话  阅读(1001)  评论(0编辑  收藏  举报

摘抄部分代码如下:

 1<SCRIPT language=JScript> 
 2           
 3        function addNewRow()
 4        {
 5                var table = document.all("mytable");
 6                var rowCount = table.rows.length-1;
 7                newrow = table.insertRow();
 8                
 9                newrow[0= newrow.insertCell();
10                newrow[0].innerHTML = "<label id='number"+rowCount+"'>"+rowCount+"</label>";
11                newrow[0].align="center";
12                
13                newrow[1= newrow.insertCell();
14                newrow[1].innerHTML = "<textarea id='content"+rowCount+"' style='WIDTH:100%'></textarea>";
15                
16                newrow[2= newrow.insertCell();
17                newrow[2].innerHTML = "<textarea id='principal"+rowCount+"' style='WIDTH:100%'></textarea>";
18                
19                newrow[3= newrow.insertCell();
20                newrow[3].innerHTML = "<textarea id='endDate"+rowCount+"' style='WIDTH:100%'></textarea>";
21                
22                newrow[4= newrow.insertCell();
23                newrow[4].innerHTML = "<select name='status"+rowCount+"' style='WIDTH:100%'><option value=''></OPTION><option value='执行中'>执行中</option></select>";
24        }

25            
26        function deleteRow()
27        {
28                var table = document.all("mytable");
29                if(table.rows.length>3)
30                {
31                    table.deleteRow();
32                }

33                else
34                {
35                    alert("至少要保留一行!");
36                }

37        }

38        
39        function Redirect()
40        {
41            var location = window.location.href;
42            var data = location.substring(location.indexOf("=")+1);
43            
44            window.location.assign("MeetDecision.aspx?meetID="+data);
45        }

46    
47        </SCRIPT>

 

 1<TABLE class=maintable id=mytable cellSpacing=1 cellPadding=1 width="100%" 
 2      align=right>
 3        <tr>
 4          <td bgColor=#84aeff colSpan=5>&nbsp;</TD></TR>
 5        <tr>
 6          <th width=35 align="center">序号</TH>
 7          <th>相 关 事 项</TH>
 8          <th width=180>责 任 人</TH>
 9          <th width=150>完 成 时 间</TH>
10          <th width=66>状 态</TH></TR>
11        <tr>
12          <td align=center><label id=number1>1</LABEL></TD>
13          <td align=center><textarea id=content1 style="WIDTH: 100%"></TEXTAREA></TD>
14          <td align=center><textarea id=principal1 style="WIDTH: 100%"></TEXTAREA></TD>
15          <td align=center><textarea id=endDate1 style="WIDTH: 100%"></TEXTAREA></TD>
16          <td align=center><select style="WIDTH: 100%" 
17            size=1 name=status1> <option value="" 
18              ></OPTION> <option value="执行中" 
19              >执行中</OPTION></SELECT> 
20  </TD></TR></TABLE></TD></TR></TABLE>
21
22<div><input id=btnAddNewRow style="WIDTH: 100px; CURSOR: hand; HEIGHT: 23px" onclick=javascript:addNewRow(); type=button value=新增一行> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
23                <input id="btnDelRow" style="WIDTH: 100px; CURSOR: hand; HEIGHT: 23px" onclick="javascript:deleteRow();"
24                    type="button" value="删除一行"></div>