0

此代码会将循环创建的最后一个值传递给 eventListener 函数，我需要附加创建 eventListener 时的值。

window.onload = function() {

var el = document.getElementsByClassName('modify');

for (var i = 0; i < el.length; i++) {

     var getId=el[i].id.split("_");

     document.getElementById("modify_y_"+getId[2]).addEventListener('mouseover', function() {
     document.getElementById("modify_x_"+getId[2]).style.borderBottom = '#e6665 solid 3px';
    }, false); 

}
}
4

2 回答 2

1

您可以使用构建器函数来做到这一点：

window.onload = function () {

    var el = document.getElementsByClassName('modify');

    for (var i = 0; i < el.length; i++) {

        var getId = el[i].id.split("_");

        document.getElementById("modify_y_" + getId[2]).addEventListener('mouseover', makeHandler(getId[2]), false);

    }

    function makeHandler(theId) {
        return function () {
            document.getElementById("modify_x_" + theId).style.borderBottom = '#e6665 solid 3px';
        };
    }
};

makeHandler由关闭的参数返回的函数theId，该参数不会改变。

于 2013-08-31T18:29:31.903 回答
1

您可以使用bind现代浏览器中所有功能上存在的原型

window.onload = function() {

var el = document.getElementsByClassName('modify');

for (var i = 0; i < el.length; i++) {

     var getId=el[i].id.split("_");

     document.getElementById("modify_y_"+getId[2]).addEventListener('mouseover', function(theid) {
       document.getElementById("modify_x_"+getId[2]).style.borderBottom = '#e6665 solid 3px';
    }.bind(null,getId[2]), false); 

}
}

如果您需要支持没有bind原生内置的旧浏览器，您可以使用从 MDN 获取的这个 poly-fill，您还可以在其中找到有关绑定原型函数的文档

if (!Function.prototype.bind) {
  Function.prototype.bind = function (oThis) {
    if (typeof this !== "function") {
      // closest thing possible to the ECMAScript 5 internal IsCallable function
      throw new TypeError("Function.prototype.bind - what is trying to be bound is not callable");
    }

    var aArgs = Array.prototype.slice.call(arguments, 1), 
        fToBind = this, 
        fNOP = function () {},
        fBound = function () {
          return fToBind.apply(this instanceof fNOP && oThis
                                 ? this
                                 : oThis,
                               aArgs.concat(Array.prototype.slice.call(arguments)));
        };

    fNOP.prototype = this.prototype;
    fBound.prototype = new fNOP();

    return fBound;
  };
}
于 2013-08-31T18:51:22.110 回答