добавить событие click для строковых элементов в массиве, переданном в div - PullRequest
Новая
       26

добавить событие click для строковых элементов в массиве, переданном в div

0 голосов
/ 08 апреля 2020

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

Я застреваю, пытаясь добавить событие щелчка к каждому отдельному имени в массиве, который использовал для заполнения div во всплывающем окне. , Я пытаюсь заполнить массив списком имен, а затем pu sh этот массив в div, который отображается во всплывающем окне. Кажется, что когда я добавляю div к тексту, я получаю одну строку, которую не могу перебрать, и я не могу добавить событие к имени, прежде чем помещу sh в массив.

В приведенном ниже случае addEventListener приводит к ошибке (... не является функцией) .. Я предполагаю, что b / c Я еще ничего не добавил в DOM: 

    var thisname = feature.get('mapfeature_name');
    thisname.addEventListener('click', function(){
        ...
    });
    // error : addEventListener is not a function

Я попробовал какой-то вариант, подобный приведенному ниже, который отображает ссылки, но я получаю только весь список, а не отдельное имя: 

namelist.push("<a href = '#'>" + thisname + "</a>");

$('#namehtml').html(eventlist.join(', '));
$('#namehtml').click (function () {
    console.log($(this).text());
    // prints entire array of names, not just the one I clicked on
});

Я не могу получить доступ к div как к любому виду списка Пока.

Кажется, это должно быть довольно просто.

1 Ответ

0 голосов
/ 09 апреля 2020

ответ на основе комментария Таплара выше: сначала добавьте класс к тегу: 

namelist.push("<a href = '#' class='this_name' >" + thisname + "</a>");

, затем добавьте событие клика к этому классу: 

    $('.this_name').click(function(){
       console.log($(this).text());
    });
...