Question

我正在使用对象表示法（http://api.jquery.com/jQuery/#jQuery2）动态创建列表项，我希望能够向其添加jQuery .data()（http://api.jquery.com/data/）。< / p>

我有当前的代码：

$('<li>', {
        id: 'filter',
        text: 'Data Filter 1',
        click: function() {
            filter['jQuery_object'] = $(this);
            filters_display.trigger('remove', filter);
        }
    }).appendTo($(this));

我试过这个：

$('<li>', {
        id: 'filter',
        text: 'Data Filter 1',
        load: function() {
            $(this).data('filter', filter);
        },
        click: function() {
            filter['jQuery_object'] = $(this);
            filters_display.trigger('remove', filter);
        }
    }).appendTo($(this));

但是当.load()附加到DOM时，似乎没有触发<li>事件。有没有办法在不通过它的id选择新<li>的情况下完成此任务？

我设想通过返回一个对象数组来完成这样的工作：

$('<li>', {
        id: 'filter',
        text: 'Data Filter 1',
        data: function() {
            return [{ key: 'filter', value: filter }]
        }
        click: function() {
            filter['jQuery_object'] = $(this);
            filters_display.trigger('remove', filter);
        }
    }).appendTo($(this));

Answer 1

var div = $("<div></div>", {
    data: {
        foo: "bar"
    }
});

alert( div.data("foo") ); // => bar

Answer 2

只需将.data('filter', filter)添加到您的链......

$('<li>', {
        id: 'filter',
        text: 'Data Filter 1',
        click: function() {
            filter['jQuery_object'] = $(this);
            filters_display.trigger('remove', filter);
        }
    }).appendTo($(this)).data('filter', filter);

Answer 3

我在jQuery IRC频道中问道，它很简单：

var div = $("<div></div>", {
    data: {
        foo: "bar"
    }
});

alert( div.data("foo") );

来自jQuery IRC频道的回答：http://jsfiddle.net/ehynds/3kw3v/

使用$（html，props）和附加.data使用jQuery创建新元素

3 个答案: