ホームページ > 記事 > ウェブフロントエンド > 上記のプログラムでは、テーブル内の行をクリックして削除することはできません。どの行をクリックしても削除されます。各行を削除するたびに削除をクリックしてください。行~ありがとう_html/css_WEB -ITnose
上記のプログラムでは、テーブル内の行をクリックして削除することはできません。どの行をクリックしても削除されます。各行を削除するたびに削除をクリックしてください。行~ありがとう_html/css_WEB -ITnose
- WBOYオリジナル
- 2016-06-24 12:08:111231ブラウズ
<!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> 上記のプログラムでは、テーブル内の行をクリックして削除することはできません。どれをクリックしても上から下に削除されます。削除をクリックするのを手伝ってください。各行の後に行を削除します~ ~~ありがとうございます
ディスカッションに返信します (解決策)
intRowIndex に問題があります
に変更してください
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); }} 以下の削除されたコードを
に変更してください
e8191598058dee8b3dfc4038dd01befe削除
やあ~~~ありがとう~~~本当に感謝しています~~~
でもdeleteRow(aTag)関数をこのように変更する意味がよくわかりませんが、これは何ですか？
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。