1

我正在尝试将 javascript 对象存储在列表元素中,这似乎工作正常,直到我尝试从另一个函数访问该数据。

这是我的 jsfiddle:http: //jsfiddle.net/RaUxB/2/

这是我的javascript:

var showData = function (li) {
    // get the stored data
    var d = $.data(li, 'testData');
    if (typeof(d) === 'undefined')
        alert ('showData() - data is undefined!');
    else
        alert ('showData() - number: [' + d.number+ '], text: [' + d.text + ']');
};

var doStuff = function () {
    $('#list').children().each(function(ix, item) {
        showData(item);
    });
};

$(document).ready(function() {
    // create a list item
    var li = $('<li>List Item 1 - Click Me!</li>').appendTo('#list');

    // store some data in it
    $.data(li, 'testData', {number:1, text:'test 1'});

    // show the data - this works!!!
    showData(li);

    // assign a click handler that will also show the data
    $(li).click(function() {
        showData(this); // this doesn't work!!!
    });
});

这是我的 HTML:

<ul id="list"></ul>
<p><a href="#" onclick="javascript:doStuff();return(false);">Try This Way</a></p>

​</p>

4

2 回答 2

2

$.data接受一个原始对象,而不是代表 DOM 元素的 jQuery 对象。

调用$.data($(...))将数据与该 jQuery 对象包装器相关联,而不是元素。

您应该使用$(...).data(),这将起作用。
或者,传递elem[0]to$.data()以在任何地方对原始 DOM 元素进行操作。

于 2012-12-11T22:31:39.540 回答
0

这是因为当您最初调用 时.showData(li)LI.data()存储在其上的那个。

尝试将此添加到您的.click()活动中:

您应该将数据存储到 -this- 元素上。

$(li).click(function() {
    // store some data into THIS - now the correct .data will be stored
    $.data(this, 'testData', {number:1, text:'test 1'});
          // ^^

    showData(this); // this (now has data) and will work
});

jsFiddle 演示

于 2012-12-11T22:36:56.520 回答