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

摘抄部分代码如下:

 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 >

你可能感兴趣的:(JavaScript)