Question

我有以下代码：

function Selector()
{
 ...
 this.items = new Array();
 // i load here the items with dom-s
 this.setActiveItem = function(item)
 {
  this.items[item].className = "selector-item-active";
  ...
 }
 var _this = this;
 for (var i=0; i<itemsName.length; i++)
  this.items[i].addEventListener("mouseup",function(){_this.setActiveItem(i)});
}

问题是当侦听器调用 setActiveItem 函数时，我在控制台中收到以下消息：

无法设置未定义的属性“className”

因此，收听者无法传递此值。

有没有解决方案？

Answer 1

事件侦听器不保留它们所属对象的this范围。您还需要使用闭包将项索引封装到回调中。相反，请尝试使用_this（正如您已定义的那样）引用变量，如下所示：

this.setActiveItem = function(item)
{
    return function (evt) {
        _this.items[item] = _this.items[item] || {};
        _this.items[item].className = "selector-item-active";
        ...
    }
}

...

for (var i=0; i<itemsName.length; i++)
    this.items[i].addEventListener("mouseup", this.setActiveItem(i));

Answer 2

每当执行mouseup事件时，i的值将等于itemsName.length。使用匿名函数来保存i;

修改后的代码：

.......
 var _this = this;
 for (var i=0; i<itemsName.length; i++){
  (function(j){
           _this.items[j].addEventListener("mouseup",
                        function(){
                              _this.setActiveItem(j);
                        }
                 );
            })(i);// preserve i for each for loop iterations
 }
}

Javascript：传递'this'值

2 个答案: