javascript - Onclick 根本没有被分配，它似乎与闭包没有任何关系

Question

我正在尝试为生成的 javascript 分配“onclick”<a>某个函数的元素，loadfunction(project[j].getName(), project[j].getPath()).

var projects = []; //Some array of classes in it

function loadProject(aName, aPath){
    //does some stuff
}

function assignOnclick(num){
    return function(){
        loadProject(projects[num].getName(), projects[num].getPath());
    };
}

for(var j = 0; j < projects.length; j++){
    var div = document.createElement("div");
    var a = document.createElement("a");
    var linkText = document.createTextNode(projects[j]);
    a.appendChild(linkText);
    a.title = projects[j].getName();
    a.href = "AProject.html";
    a.onclick = assignOnclick(j);
    div.appendChild(a)
    div.classList.add("project");
    document.getElementById("projcontainer").appendChild(div)
}

理想情况下，这应该将 onclick 设置为调用 loadProject()具有定义的参数。元素已生成，代码中的其他所有内容都有效，但它们没有分配任何 onclick 函数，我不明白为什么。任何帮助将不胜感激。

Answer 1

var projects = []; //Some array of classes in it

function loadProject(aName, aPath){
    //does some stuff
}

for(var j = 0; j < projects.length; j++){

     var div = document.createElement("div");
     var a = document.createElement("a");

     var linkText = document.createTextNode(projects[j]);

     a.appendChild(linkText);
     a.title = projects[j].getName();
     a.href = "AProject.html";

     a.setAttribute('data-name', projects[j].getName());
     a.setAttribute('data-path', projects[j].getPath());

     a.addEventListener('click', function (event) {

         var name = event.target.getAttribute('data-name');
         var path = event.target.getAttribute('data-path');

         loadProject(name, path);
     });

    div.appendChild(a)
    div.classList.add("project");
    document.body.appendChild(div);
}