jquery-mobile - on() 不适用于使用 jQuery 的实时数据，如何？

Question

我有一些动态数据被附加到列表中，并且该数据中的任何链接似乎都不起作用。

我正在使用 jquery 1.8.3 并且on()应该考虑该live方法，我认为

setInterval(function () {
    getNot();
}, 2000);

function getNot() {
    var data = {
        t1: 'test1',
        t2: 'test2',
        t3: 'test3'
    };
    var size = 0,
        li = '';
    $.each(data, function (k, v) {
        li += '<li>' +
            '<a href="#" class="add" data-listid="' + k + '">' +
            '<h2>load data - ' + k + '</h2>' +
            '</a>' +
            '</li>';
        size++;
    });

    var but = $('#not'),
        ul = $('#not_ul');

    but.find('span').text(size + ' Notifications');
    ul.html(li);
    ul.listview().listview("refresh");
}

// this doesn't seem to work
$('.add').on("click", function () {
    var listId = $(this).data('listid');
    console.log(listId);
    return false;
});

在此处查看完整示例

关于这个问题的任何想法？

Answer 1

$('.add').on("click", function () {

您需要传递一个选择器来on生成一个委托事件：

$('#{containerId}').on("click", '.add', function () {
    var listId = $(this).data('listid');
    console.log(listId);
    return false;
});

containerId应该是最接近动态 created s 元素的静态元素。.add