猿问

将onclick事件添加到表行

我试图通过Javascript向表行添加onclick事件。


function addRowHandlers() {

    var table = document.getElementById("tableId");

    var rows = table.getElementsByTagName("tr");

    for (i = 1; i < rows.length; i++) {

        row = table.rows[i];

        row.onclick = function(){

                          var cell = this.getElementsByTagName("td")[0];

                          var id = cell.innerHTML;

                          alert("id:" + id);

                      };

    }

}

这在Firefox中可以正常工作,但是在Internet Explorer(IE8)中,我无法访问表格单元格。我认为这与onclick函数中的“ this”被标识为“ Window”而不是“ Table”(或类似的东西)有关。


如果我可以访问当前行,则可以getElementById在onclick函数中执行,因为我找不到这样做的方法。有什么建议么?


杨魅力
浏览 557回答 3
3回答

白衣非少年

这样的事情。function addRowHandlers() {&nbsp; var table = document.getElementById("tableId");&nbsp; var rows = table.getElementsByTagName("tr");&nbsp; for (i = 0; i < rows.length; i++) {&nbsp; &nbsp; var currentRow = table.rows[i];&nbsp; &nbsp; var createClickHandler = function(row) {&nbsp; &nbsp; &nbsp; return function() {&nbsp; &nbsp; &nbsp; &nbsp; var cell = row.getElementsByTagName("td")[0];&nbsp; &nbsp; &nbsp; &nbsp; var id = cell.innerHTML;&nbsp; &nbsp; &nbsp; &nbsp; alert("id:" + id);&nbsp; &nbsp; &nbsp; };&nbsp; &nbsp; };&nbsp; &nbsp; currentRow.onclick = createClickHandler(currentRow);&nbsp; }}

慕桂英546537

我认为对于IE,您将需要使用Event对象的srcElement属性。如果jQuery是您的选择,则可能要考虑使用它-因为它会为您抽象出大多数浏览器差异。jQuery示例:$("#tableId tr").click(function() {&nbsp; &nbsp;alert($(this).children("td").html());});

慕田峪9158850

这是@redsquare和@SolutionYogi上面讨论的同一纯Javascript(不是jQuery)解决方案的紧凑且更简洁的版本,该解决方案onclick在所有主要的Web浏览器中都可以使用,其中包括:最新的IE11:function addRowHandlers() {&nbsp; &nbsp; var rows = document.getElementById("tableId").rows;&nbsp; &nbsp; for (i = 0; i < rows.length; i++) {&nbsp; &nbsp; &nbsp; &nbsp; rows[i].onclick = function(){ return function(){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;var id = this.cells[0].innerHTML;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;alert("id:" + id);&nbsp; &nbsp; &nbsp; &nbsp; };}(rows[i]);&nbsp; &nbsp; }}window.onload = addRowHandlers();注意:为了使其也能在IE8中工作,请this使用function(myrow)@redsquare所建议的显式标识符代替指针。最好的祝福,
随时随地看视频慕课网APP
我要回答