日期:2014-05-16  浏览次数:20511 次

js 闭包问题
还是老问题,循环给元素添加事件,事件是添加上了,但是好像只有循环的最后一个元素有效,找了好多参考,但是还是没解决,请大家帮帮忙...先谢了...

JScript code

function test() {
    var container = document.createElement("ul");
    for (var i = 0; i < 10; i++) {
        // 循环创建子元素,并为子元素添加事件
        var item_box = document.createElement("li");
        item_box.innerHTML = i;

        // 调用addEventHandler方法添加事件
        addEventHandler(item_box, "mouseover", function() {
            addClass(item_box, "hover");// 调用addClass方法添加class
        });
        addEventHandler(item_box, "mouseout", function() {
            removeClass(item_box, "hover");
        });
        addEventHandler(item_box, "click", function() {
            alert(i);
        });
    }
}

function addEventHandler(tatget, eventName, handler) {
    if (tatget.addEventListener) {
        tatget.addEventListener(eventName, handler, false);
    } else if (tatget.attachEvent) {
        tatget.attachEvent("on" + eventName, handler);
    } else {
        tatget["on" + eventName] = handler;
    }
}

function addClass(target, name) {
    if (!hasClass(target, name)) {
        target.className += " " + name;
    }
}


虽然知道是闭包问题,但是不知道怎么改...

------解决方案--------------------
你这代码不对 container 根本没用到
------解决方案--------------------
addEventHandler(item_box, "click", (function(i) {
return function(){ alert(i);};
})(i););

------解决方案--------------------
是不以前创建的item_box被后来创建的给覆盖了
------解决方案--------------------
除了 addEventHandler(item_box, "click", function() {
alert(i);
});

其他没有闭包问题~