jQuery - $ .data（） - 從另一個函數訪問時數據丟失 - 返回undefined

我試圖存儲一個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>

來源

2012-12-11 Redtopia

$.data需要原始對象，而不是一個jQuery對象代表一個DOM元素。

調用$.data($(...))將數據與該jQuery對象包裝器關聯，而不是元素。

您應該使用$(...).data()，這將工作。
或者，通過elem[0]到$.data()以對各處的原始DOM元素進行操作。

來源

2012-12-11 22:31:39 SLaks

根據http://api.jquery.com/jQuery.data/，它需要的元素，一個關鍵字和一個值 – Redtopia

@Redtopia：對。一個** DOM元素**，不是一個jQuery對象。 – SLaks

好的，這種變化確實有效... http://jsfiddle.net/RaUxB/3/ – Redtopia

這是因爲當您最初打電話時.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 Demo

來源

2012-12-11 22:36:56

jQuery - $ .data（） - 從另一個函數訪問時數據丟失 - 返回undefined

回答

相關問題