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相反，它用于将事件处理程序应用于尚未创建的元素。

如果您当前有点击设置，请尝试如下操作:

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

<小时/>

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

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