Home >Web Front-end >HTML Tutorial >In the above program, when you click to delete a row in the table, you cannot delete it at will. No matter which one you click, it will be deleted from top to bottom. Please help him to click delete after each row to delete the row~Thank you_html/css_WEB -ITnose
In the above program, when you click to delete a row in the table, you cannot delete it at will. No matter which one you click, it will be deleted from top to bottom. Please help him to click delete after each row to delete the row~Thank you_html/css_WEB -ITnose
- WBOYOriginal
- 2016-06-24 12:08:111304browse
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><HTML><HEAD><TITLE> Table 对象得方法 </TITLE><script language="JavaScript">var intRowIndex = 0;function insertRow(tbIndex){ var objRow = myTable.insertRow(tbIndex); var objCel = objRow.insertCell(0); objCel.innerHTML = document.myForm.myCell1.value; var objCel = objRow.insertCell(1); objCel.innerHTML = document.myForm.myCell2.value; var objCel = objRow.insertCell(2); objCel.innerHTML = "<a href='javaScript:deleteRow(intRowIndex)'>删除</a>"; objRow.attachEvent("onmouseover",getIndex); objRow.style.background = "pink";}function deleteRow(tbIndex){ myTable.deleteRow(tbIndex);}function getIndex(){ intRowIndex = event.srcElement.parentElement.rowIndex; pos.innerText = intRowIndex;}</script><META NAME="Generator" CONTENT="EditPlus"><META NAME="Author" CONTENT=""><META NAME="Keywords" CONTENT=""><META NAME="Description" CONTENT=""></HEAD><BODY onload="pos.innerText=intRowIndex;"><h2>Table对象得方法</h2><hr>当前位置：<span id="pos"></span><table id="myTable" border=1><tr onclick="getIndex()"><td>HTML</td><td>Css</td></tr><tr onclick="getIndex()"> <td>JavaScript</td> <td>VBScript</td></tr></table><form name="myForm">第一栏：<input type="text" name="myCell1" value="CGI"><br>第二栏：<input type="text" name="myCell2" value="ASP"><br><input type="button" onclick="insertRow(intRowIndex)" value="插入行"><a href='javaScript:deleteRow(intRowIndex)'>删除</a><input type="button" onclick="insertRow(myTable.rows.length)" value="添加行" ></form></tr></BODY></HTML> In the above program, when you click to delete a row in the table, you cannot delete it at will. No matter which one you click, it will be deleted from top to bottom. Please help so that he can click it. Delete after each line, delete the line~~~Thank you
Reply to the discussion (solution)
There is a problem with your intRowIndex
Change to
function insertRow(tbIndex){ var objRow = myTable.insertRow(tbIndex); var objCel = objRow.insertCell(0); objCel.innerHTML = document.myForm.myCell1.value; var objCel = objRow.insertCell(1); objCel.innerHTML = document.myForm.myCell2.value; var objCel = objRow.insertCell(2); objCel.innerHTML = "<a href='#' onclick='deleteRow(this);return false;'>删除</a>"; objRow.attachEvent("onmouseover",getIndex); objRow.style.background = "pink";}function deleteRow(aTag){ if(arguments.length>0) { o = aTag.parentNode while(o.tagName!="TR") o=o.parentNode o.parentNode.removeChild(o); } else { myTable.deleteRow(intRowIndex); }} Change the deleted code below to
7b15a549a3ec43b12a0ce003ee945022Delete5db79b134e9f6b82c0b36e0489ee08ed
Hey~~~Thank you~~~I’m so grateful~~~
But I don’t understand how to change function deleteRow(aTag) like this What does it mean?
Statement：
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn