Question

这是我的代码

function AddItemOnTable(){
      if(getCookie("no") == null){
          var no = 1;
      }else if(parseInt(getCookie("no")) > 0){
          var no = getCookie("no");
      }else{
          var no = 1;
      }

      var tableRef = 
      document.getElementById('whatToBuy').getElementsByTagName('tbody')[0];
      var newRow   = tableRef.insertRow(tableRef.rows.length);// Nambahin row di 
      tabel diurutan terakhir

      var cell_no  = newRow.insertCell(0);// Tambah row pada index yang ke 0
      var newText  = document.createTextNode(String(no));// Memberikan text
      cell_no.appendChild(newText);
      no = String(parseInt(no) + 1);
      document.cookie = "no="+no;

      var cell_btn  = newRow.insertCell(7);
      var input = document.createElement("input");
      input.type = "button";
      input.className = "button";
      input.value = "x";
      var index = parseInt(no-2);
      //alert(index);
      input.onclick = "DeleteRow(index)";
      cell_btn.appendChild(input);
}
function DeleteRow(no){
  document.getElementById("whatToBuy").deleteRow(no);
  alert("a");
}

位于：input.onclick =＆＃34; DeleteRow（index）＆＃34;;

为什么它不会调用＆＃34;删除行＆＃34;的功能？对不起我的英语不好，我是网络开发的新人：D

Answer 1

发布的代码存在两个问题。

首先：button元素的onclick属性需要一个函数对象。

（设置onclick="doSomething()"可以在HTML中用于在元素的开始标记内设置单击处理程序，但只能由HTML解析器解析，并且不能在纯JavaScript中使用。）< / p>

第二：deleteRow方法使用表中行的当前基于零的索引，但是传递的参数是从cookie或原始表获得的no值位置。

此处建议的解决方案是对所有行使用相同的DeleteRow函数，但要修改它以查找单击按钮的当前行位置：

＆＃13;

var no = 100; // testing
var table = document.getElementById("whatToBuy");

function addRows() { // testing
    for( var  i = 0; i < 5; ++i) {
        var button = document.createElement("BUTTON");
        button.type = "button";
        button.textContent = "delete index " + no;
        button.onclick = DeleteRow;

        var row = document.createElement("TR");
        var cell = document.createElement("TD");
        cell.appendChild(button);
        row.appendChild(cell);
        table.appendChild( row);

        ++no;
    }
}

function DeleteRow() {
    // find row to delete;

    for( var row = this; row=row.parentNode;) {
        if( row.tagName == "TR") {
            break;
        }
    }
    var rows = table.querySelectorAll("TR");
    for( var i = 0; i < rows.length; ++i) {
        if( rows[i] === row) {
            table.deleteRow( i);
            break;
        }
    }
}

＆＃13;

<table id="whatToBuy">
</table>
<button type="button" onclick="addRows()">add some rows</button>

＆＃13;

如果需要确定要删除的行的no值，我建议在行元素上设置并检查data attribtue，例如data-no。< / p>

如何用javascript删除表上的特定行？使用document.createElement（）

1 个答案: