Warum zielen Ereignis-Listener in einer For-Schleife auf das letzte Objekt ab?

addEventListener mithilfe einer For-Schleife und Übergeben von Werten

Bei Verwendung einer for-Schleife zum Hinzufügen von Ereignis-Listenern zu mehreren Objekten wird häufig das letzte Objekt verwendet Das Ziel für alle Listener-Verlagerungen. Dieser Artikel wird dieses Problem lösen und einen korrigierten Code mithilfe von Abschlüssen bereitstellen:

Problemübersicht:

Es wird versucht, eine Schleife zu verwenden, um Ereignis-Listener zu mehreren Objekten hinzuzufügen, aber letztendlich Alle Listener zielen auf dasselbe Objekt (das letzte).

Korrekturcode:

Abschluss ist eine Möglichkeit, solchen Problemen vorzubeugen. Der geänderte Code lautet wie folgt:

// 函数在点击时运行：
function makeItHappen(elem, elem2) {
    var el = document.getElementById(elem);
    el.style.backgroundColor = "red";
    var el2 = document.getElementById(elem2);
    el2.style.backgroundColor = "blue";
}

// 自动加载函数以添加侦听器：
var elem = document.getElementsByClassName("triggerClass");

for (var i = 0; i < elem.length; i += 2) {
    (function () {
        var k = i + 1;
        var boxa = elem[i].parentNode.id;
        var boxb = elem[k].parentNode.id;
        elem[i].addEventListener("click", function() { makeItHappen(boxa, boxb); }, false);
        elem[k].addEventListener("click", function() { makeItHappen(boxb, boxa); }, false);
    }()); // 立即调用
}

Das obige ist der detaillierte Inhalt vonWarum zielen Ereignis-Listener in einer For-Schleife auf das letzte Objekt ab?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!