1

我正在尝试使用 javascript 在 HTML 中创建一个表格。它有一个添加新行的添加按钮和一个删除行的删除按钮。它看起来像这样:

桌子

数字是ID

    <table id = "table1" border = 2>
        <tr>
            <td> <img id="add" src="images/add_over.png" onclick=help() /> </td>
        </tr>
    </table>

基本上我试图删除整个表并重新创建它少一行。

var array1 = new Array();

function help() {
    addRow();
    push();
}

function addRow() {
    var tableId= "table1";
    var number= array1.length;
    var newRow = document.getElementById(tableId).insertRow(number+ 1);

    var newData = document.createElement("td");
    var newDiv= document.createElement("div");
    newDiv.innerHTML = array1.length;
    newData.appendChild(newDiv);

    var newCellDeleteButton = document.createElement("td");
    var deleteButtonImg = document.createElement('img');
    deleteButtonImg.id = number;
    deleteButtonImg.border = '0';
    deleteButtonImg.src = "images/delete_up.png";
    deleteButtonImg.onmouseover = function() {
        this.src = 'images/delete_over.png';
    };
    deleteButtonImg.onmouseout = function() {
        this.src = 'images/delete_up.png';
    };
    deleteButtonImg.onclick = function() {
        deleteRow(number);
    };
    newCellDeleteButton.appendChild(deleteButtonImg);
    newRow.appendChild(newRow);
    newRow.appendChild(newCellDeleteButton);
}


function deleteRow(rowID) {
    var tempHelpRow = array1.length;
    pop(rowID);

    for (var i = 1; i <= tempHelpRow ; i++) {
        document.getElementById("table1").deleteRow(1);
    }

    for (var i = 0; i <= array1.length; i++) {
        addRow();
    }

}

function pop(ID) {

    array1.pop(ID);
}

function push() {

    var test = new objectt();
    array1.push(test);
}

function objectt() {

}

问题是,如果我尝试删除一行,它会删除所有内容。

4

0 回答 0