单击之前执行addEventListener单击

Question

我想在click函数中传递参数.

var albums = document.getElementsByClassName("album");
for(var i = 0; i<albums.length; i++){
    document.getElementById(albums[i].id).addEventListener("click", goAlbum(albums[i].id), false);
}

但是,函数"goAlbum"在创建时会被激活,然后函数将不再执行.我究竟做错了什么？

Answer 1

goAlbum因为你调用了这个函数而被执行了.你没有"创造"一个功能.你打算做的是提供addEventListener逻辑,以便在点击某些内容时执行; 那个逻辑是"调用goAlbum"的.为此,请将函数调用包装在匿名函数中.

function toArray(list) {
    return Array.prototype.slice.call(list);
}

var albums = toArray(document.getElementsByClassName("album"));
albums.forEach(function (album) {
    document.getElementById(album.id).addEventListener("click", function () {
        goAlbum(album.id);
    }, false);
});

另外,因为在for循环中创建函数是不明智的,所以我重构了你要使用的代码forEach.我需要将NodeList返回的转换document.getElementsByClassName为a Array才能使用forEach,因此toArray函数.