Question

我有一个带有元素列表的JSON文件。对于此列表中的每个元素，都会创建一个容器。这是代码：

$.getJSON('/data/risks.json', function(data) {
var html = '';

$.each(data.risk, function(key, value){
    html += '<div class="elementlist">';
    html += '<br><p><b>'+value.name+'</b><br><br>'+value.description+'</p>';
    html += '</div>';
});
$('#list').html(html);
});

现在我需要知道用户点击了哪个容器。这样：

$('.elementlist').click(function(){
var chosenRisk = $(this).text(); 
    console.log(chosenRisk);
});

适用于页面上已有的容器，但适用于基于JSON文件创建的容器。最好的方法是什么？

问候

Answer 1

委派活动。

$(document).on('click', '.elementlist', function(){
    var chosenRisk = $(this).text(); 
    console.log(chosenRisk);
});

我还建议将document更改为'#list'，以便稍微提高性能。

Answer 2

您需要delegate处理事件

$('#list').on( "click", ".elementlist", function(){
    var chosenRisk = $(this).text(); 
    console.log(chosenRisk);
});

检查是否已单击自动创建的div

2 个答案: