javascript - 将对象的键传递给 onclick 函数

Question

我正在尝试创建一个无序列表菜单，但无法通过 onclick 调用正确的函数。如何通过 onclick 函数传递对象的键？

function ulMenu(menuList) {

    for (var keys in menuList) {
        var li = document.createElement("li");

        var textNode = document.createTextNode(keys);
        li.appendChild(textNode);

        li.onclick = function() { ?keys? };

        ul.appendChild(li);
    }

    var element = document.getElementsByTagName("body")[0];
    element.appendChild(ul);
}

window.onload = function() {
    ulMenu({Register: Register,"Sign In": Login});
    }

function Login() {
    alert("Login Function");
}

function Register() {
    alert("Register Function");
}

Answer 1

您需要了解闭包在 JavaScript中的工作原理，但答案如下：

li.onclick = (function (keys) {
    return function () {
        //handler code
        console.log(keys);
    };
})(keys);

更有效的方法是在循环之外创建一个负责生成处理程序的函数。

function createClickHandler(keys) {
    return function () {
        //use keys
    };
}

然后在循环中：

li.onclick = createClickHandler(keys);