Сложность разработки уникальных динамических событий onclick в Javascript

Question

Я работаю с приличным размером данных, относящихся к объектам на странице, и некоторые объекты нуждаются в ссылках, которые к ним применяются при нажатии.Ссылка для подключения является частью набора данных, и я строю строку для ссылки с переменной linkTarget и применяю ее следующим образом.

 if (dataTag[i][3]==true){

    if(prepend==undefined || prepend=="undefined"){                         
        var linkTarget=ResultsJSON["targetUrl"];
        ele.onclick = function(){
            window.open(linkTarget);
        };
    } else {
        var linkTarget=prepend+ResultsJSON["targetUrl"];
        ele.onclick = function(){
            window.open(linkTarget);
        };
    }

ele относится к выбранному элементус getElementByID.Сейчас я прохожу довольно много объектов, и проблема, с которой я сталкиваюсь, заключается в том, что щелчок для каждого объекта является последним значением linkTarget.Все это содержится в функции, а цель ссылки является локальной переменной, поэтому я понятия не имею, почему.Я попытался использовать массив с чем-то вроде

ele.onclick=function(){window.open(linkTarget[linkTarget.length-1]);};

и даже

ele.onclick=function(){window.open(linkTarget.valueOf());};

с теми же результатами.Сейчас я в растерянности и буду признателен за любую помощь.

Answer 1

Используйте Array.forEach() для итерации ваших данных и наблюдения за устранением проблем.

dataTag.forEach(function (item) {
    if (item[3]==true) {
        var linkTarget = "";
        if (prepend==undefined || prepend=="undefined") {
            linkTarget = prepend;
        }
        linkTarget += ResultsJSON.targetUrl;
        ele.onclick = function () {
            window.open(linkTarget);
        };
    }
});

См. примечание о совместимости для использования Array.forEach() в старых версияхбраузеры.

Answer 2

Вы находитесь в цикле - поэтому вам нужно поместить ваши вещи, которые будут выполнены, в другую функцию, например так:

 if(dataTag[i][3]) {
    if(prepend) {   
        (function(linkTarget) {
            ele.onclick = function() {
                window.open(linkTarget);
            };
        })(ResultsJSON.targetUrl);
    } else {
        (function(linkTarget) {
            ele.onclick = function() {
                window.open(linkTarget);
            };
        })(ResultsJSON.targetUrl);
    }

Я также внес несколько общих исправлений.