javascript - jQuery函数未附加到dom元素

Question

我正在尝试构建一个网页，该网页将从 JSON 文件构造元素并将点击功能附加到这些元素。

$(document).ready(function(){

 $.ajax({
        url: 'database.php',
        type: "POST",
        dataType: 'json',
        success: function (datas) {
            (datas);
            for (var x = 0; x < datas.data.length; x++) {
                var id = datas.data[x].ID;
                var ip = datas.data[x].IP;
               var ips='<div class="ip"><span id="ids">'+id+'</span><span id="number">'+ip+'</span></div>';
               $('#left').append(ips);

            }
        }
    });

$('.ip').click(function () {
alert($(this).children('#ids').text());
});

});

上面的代码成功构建了元素，但点击功能不起作用。

Answer 1

您可以改用on函数，它用于将事件处理程序应用于尚未创建的元素。

如果您有当前click设置，请尝试以下方法：

$(document).on('click', '.ip', function(){
    alert($(this).children('#ids').text());
});

---

正如@Pete 所建议的那样，id在循环中分配相同的属性并不是一个好主意，它们应该是文档唯一的。考虑改为通过名称查找它们class，这样您就可以发出如下警告：

alert($(this).children('.MyIdsSpan').text());