表格插入行与删除行示例

pengjianbo1 · 发表于 2013-2-7 20:35:32

<html> <head> <title>表格插入行与删除行示例</title> <script type="text/javascript"> //参数列表[表格Id,复制行的索引,标题行数,表单Id] function clickInsert(inputTable,rowId,titleRow,inputForm){ var oForm=document.getElementById(inputForm); var oTable=document.getElementById(inputTable); var obj =window.event.srcElement; var oTd = obj.parentElement; var oTr = oTd.parentElement; var oRow = oTr.rowIndex; var oTr1 = oTable.insertRow(oRow+1); var oCells = oTr.cells; for(i=0;i<oCells.length;i++){ var cell = oCells[i].innerHTML; var cell1 = oTr1.insertCell(i); cell1.innerHTML=cell; } oForm.flag[oRow+1-titleRow].value="1"; //alert(oForm.flag[oRow+1-titleRow].value="1"); } //参数列表[表格Id,标题行数,表单Id] function clickDelete(inputTable,titleRow,inputForm){ var oForm=document.getElementById(inputForm); var oTable=document.getElementById(inputTable); var obj =window.event.srcElement; var oTd = obj.parentElement; var oTr = oTd.parentElement; var oRow = oTr.rowIndex; oTr.style.display="none"; oForm.flag[oRow-titleRow].value="2"; // alert(oForm.flag[oRow-titleRow].value); } function submitForm(){ var flags= inputForm.flag; for(i=0;i<flags.length;i++){ alert(flags[i].value); } } </script> </head> <body> <form action="" name="inputForm" id="inputForm"> <table id="inputTable" width="50%" align="center" border="1" cellpadding="0" cellspacing="0"> <tr> <td> 学生 </td> <td> 课程 </td> <td> &nbsp; </td> <td> &nbsp; </td> </tr> <tr style="display: none;"> <td> <input type="hidden" name="flag" id="flag" value="-1" /> <select id="studentId"> <option value="01"> 张三 </option> <option value="02"> 李四 </option> </select> </td> <td> <select id="courseId"> <option value="01"> 英语 </option> <option value="02"> 数学 </option> </select> </td> <td> <input type="button" name="insertButton" value="新增" /> </td> <td> <input type="button" name="deleteButton" value="删除" /> </td> </tr> <tr> <td> <input type="hidden" name="flag" id="flag" value="1" /> <select id="studentId"> <option value="01"> 张三 </option> <option value="02"> 李四 </option> </select> </td> <td> <select id="courseId"> <option value="01"> 英语 </option> <option value="02"> 数学 </option> </select> </td> <td> <input type="button" name="insertButton" value="新增" /> </td> <td> <input type="button" name="deleteButton" value="删除" /> </td> </tr> </table> <br /> <center><input type="button" name="submitButton" value="提交" /></center> </form> </body></html>

		自动登录	找回密码
密码			立即注册