首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > JavaScript >

纯js 操作dom回动态添加一行删除一行

2012-10-28 
纯js操作dom来动态添加一行删除一行?function addOneLineOnClick() {??? ??? var row document.getElemen

纯js 操作dom来动态添加一行删除一行

?function addOneLineOnClick() {
??? ??? var row= document.getElementById("tblFlowCardDetail").insertRow(document.getElementById("tblFlowCardDetail").rows.length);
??? ??? var col = row.insertCell(0);
??? ??? col.innerHTML = "<input type="hidden" name="aimInnerId"><input readonly="true" maxLength=6 size=6 name=aimId><input type=button? value =...?? name=btnSelectAimClient index=""+ rowIndex +"" onclick="selectAimClient(this.index)">";
??? ??? col = row.insertCell(1);
??? ??? col.innerHTML = "<input id=aimName name=aimName size=25 maxlength=25 readonly="true">";
??? ??? col = row.insertCell(2);
??? ??? col.innerHTML = "<input readonly="true" maxLength=6 size=6 name=itemNo><input type=button? value =...?? name=btnSelectItem index=""+ rowIndex +"" onclick="selectItem(this.index)">";
??? ??? col = row.insertCell(3);
??? ??? col.innerHTML = "<input id=itemName name=itemName size=25 maxlength=25 readonly="true">";??? ???
??? ??? col = row.insertCell(4);
??? ??? col.innerHTML = "<input id=spec name=spec size=10 maxlength=10 readonly="true">";
??? ??? col = row.insertCell(5);
??? ??? col.innerHTML = "<input id=pattern name=pattern size=10 maxlength=10 readonly="true">";
??? ??? col = row.insertCell(6);
??? ??? col.innerHTML = "<input id=unit name=unit size=4 maxlength=4 readonly="true">";
??? ??? col = row.insertCell(7);
??? ??? col.innerHTML = "<input id=qty name=qty size=6 maxlength=6>";
??? ??? col = row.insertCell(8);
??? ??? col.innerHTML = "<input type='button' value='删除' id=btnDeleteLine name=btnDeleteLine onclick="return DeleteRow('row" + rowIndex + "')">";
??? ??? row.setAttribute("id", "row" + rowIndex);
??? ??? rowIndex++;
??? }
???
??? function DeleteRow(rowTag){
??? //alert(rowTag);
???? ??? var i =? document.getElementById("tblFlowCardDetail").rows(rowTag).rowIndex;
???? ??? var j;
??? ??? for(j=i;j<=rowIndex;j++) {???
??? ??? ??? document.getElementById("tblFlowCardDetail").rows(j).cells(0).all("btnSelectAimClient").index--;
??? ??? ??? document.getElementById("tblFlowCardDetail").rows(j).cells(2).all("btnSelectItem").index--;???
??? ??? }
??? ??? //alert(i);
?????? ??? document.getElementById("tblFlowCardDetail").deleteRow(i);
??? ??? rowIndex--;
??? }

?

?

<table width="95%" border="0" cellpadding="0" cellspacing="0"
??? ??? ??? ??? ??? name="tblFlowCardDetail" id="tblFlowCardDetail">
??? ??? ??? ??? ??? <tr>
??? ??? ??? ??? ??? ??? <td nowrap>
??? ??? ??? ??? ??? ??? ??? <div align="left">
??? ??? ??? ??? ??? ??? ??? ??? <font color="#FF0000">*</font>需方客户代码
??? ??? ??? ??? ??? ??? ??? </div>
??? ??? ??? ??? ??? ??? </td>
??? ??? ??? ??? ??? ??? <td nowrap>
??? ??? ??? ??? ??? ??? ??? <div align="left">
??? ??? ??? ??? ??? ??? ??? ??? 需方客户名称
??? ??? ??? ??? ??? ??? ??? </div>
??? ??? ??? ??? ??? ??? </td>
??? ??? ??? ??? ??? ??? <td nowrap>
??? ??? ??? ??? ??? ??? ??? <div align="left">
??? ??? ??? ??? ??? ??? ??? ??? <font color="#FF0000">*</font>物料代码
??? ??? ??? ??? ??? ??? ??? </div>
??? ??? ??? ??? ??? ??? </td>
??? ??? ??? ??? ??? ??? <td nowrap>
??? ??? ??? ??? ??? ??? ??? <div align="left">
??? ??? ??? ??? ??? ??? ??? ??? 物料名称
??? ??? ??? ??? ??? ??? ??? </div>
??? ??? ??? ??? ??? ??? </td>
??? ??? ??? ??? ??? ??? <td nowrap>
??? ??? ??? ??? ??? ??? ??? 规格
??? ??? ??? ??? ??? ??? </td>
??? ??? ??? ??? ??? ??? <td nowrap>
??? ??? ??? ??? ??? ??? ??? 型号
??? ??? ??? ??? ??? ??? </td>
??? ??? ??? ??? ??? ??? <td nowrap>
??? ??? ??? ??? ??? ??? ??? 计量单位
??? ??? ??? ??? ??? ??? </td>
??? ??? ??? ??? ??? ??? <td nowrap>
??? ??? ??? ??? ??? ??? ??? <font color="#FF0000">*</font>操作数量
??? ??? ??? ??? ??? ??? </td>
??? ??? ??? ??? ??? ??? <td nowrap>
??? ??? ??? ??? ??? ??? ??? <div align="left">
??? ??? ??? ??? ??? ??? ??? ??? 删除
??? ??? ??? ??? ??? ??? ??? </div>
??? ??? ??? ??? ??? ??? </td>
??? ??? ??? ??? ??? </tr>
??? ??? ??? ??? </table>
??? ??? ??? ??? <p>

热点排行