1

我通过 HTML 创建了一个表格,其中一个列包含一系列按钮,用于添加新行、删除该特定行或向上或向下移动该行。我可以添加新行,但在删除按下按钮的同一行时遇到了一些问题。我使用警报方法来显示行索引,当我单击按钮时,它显示行索引未定义,但如果我单击同一行中的其他任何位置,它会显示正确的行索引!

我是 Javascript 的新手,想用纯 JavaScript 来做这件事。

我设置了一个警报来确定正在调用哪个行索引,并且由于某种原因,当我单击按钮时,它说行索引未定义,但下一个警报框显示正确的行索引。

    function removeData(x) {
        var ind = x.rowIndex;
        alert(ind);
        //document.getElementById("table1").deleteRow(ind);
    }

   <table id="table1" border="2px">
            <tr>
                <th>Column 1</th> <th>Column 2</th> <th>Column 3</th> <th>Column 4</th> 
            </tr>   
            <tr id="enterData" onclick="removeData(this)">
                <td id="buttons"><input type="button" value="Remove" id="button1" onclick="removeData(this)" /> 
                    <input type="button" value="Up" id="button2" onclick="up()" />
                    <input type="button" value="Down" id="button3" onclick="down()" /> 
                    <input type="button" value="Add" id="button4" onclick="editTable()" />
                </td>
            </tr>       
        </table>
4

1 回答 1

1

您会看到两个警报,因为 click 事件正在通过 DOM 冒泡。

你的tr和一个input元素都有onclick=removeData(this)处理程序。

首先 click 事件在按钮上触发(这就是rowIndex未定义的原因),然后它冒泡到tr(这就是第二个警报向您显示正确值的原因)。

于 2013-02-13T18:49:40.163 回答