将点击事件添加到传递给div的数组中的字符串元素中

Question

我有一个基于地图的应用程序，我需要在地图上单击以检索那时所有功能的名称，然后能够在弹出窗口中看到该功能名称的列表，然后单击每个名称。然后，病态会使用从该点击获得的名称来在地图上选择该地图项。

我在尝试将click事件添加到我用来在弹出窗口中填充div的数组中的每个单独名称时遇到了麻烦。我试图用名称列表填充一个数组，然后将该数组推入div，该div在弹出窗口中呈现。似乎当我在div后面附加文本时，我遇到了无法迭代的一个字符串，并且在推入数组之前似乎无法在名称中添加事件。

在以下情况下，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。

这似乎应该很简单。

Answer 1

根据上述Taplar的评论进行回答：首先将类添加到标签：

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

然后将click事件添加到该类：

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