Question

我正在尝试在我的表格中创建新行时插入onmouseover，但它没有出现。我错过了一些愚蠢的东西吗？

    var row = document.createElement("TR");
    row.id = i;
    row.onmouseover = hover(i);
    var td1 = document.createElement("TD");
    row.appendChild(td1);
    tbody.appendChild(row);

变量'i'是循环中的当前数字。行的ID显示正常，但不是onmouseover。

Answer 1

使用匿名函数为i的值创建闭包，确保将函数设置为onmouseover ，而不是调用的结果功能：

var row = document.createElement("TR");
(function (i) {
    row.onmouseover = function () { hover(i) };
})(row.id);
var td1 = document.createElement("TD");
row.appendChild(td1);
tbody.appendChild(row);

<小时/> 正确看看您的代码，您似乎并未实际设置TR元素的id属性。但是，您可能希望完全避免这种情况，并在悬停函数中使用this上下文：

var row = document.createElement("TR");
row.onmouseover = hover;
var td1 = document.createElement("TD");
row.appendChild(td1);
tbody.appendChild(row);

function hover() { 
    alert(this.rowIndex);  // <-- `this` refers to the row element
}

Answer 2

您正在将事件的结果分配给事件。

需要像

这样的东西

row.onmouseover=function(){hover(this);}

最好使用它，因为你有DOM对象而不必查找任何东西。

function hover( row ){
     row.style.color = "red";
}

如果您仍然按照我的方式进行操作，则需要更改您的ID以使其有效。 ID不能以数字开头。

var row = document.createElement("TR");
row.id = "row_i";
row.onmouseover = function(){ hover(this.id); }
var td1 = document.createElement("TD");
row.appendChild(td1);
tbody.appendChild(row);

Answer 3

也许试试：

row.onmouseover = function() { hover(i); };

DOM onmouseover没有出现

3 个答案: