使用 jQuery.data 存储项目列表答案

【问题标题】：Using jQuery.data to store a list of items使用 jQuery.data 存储项目列表
【发布时间】：2010-11-09 07:49:59
【问题描述】：

我正在处理一个需要将对象列表与表格行相关联的页面，并且我正在使用 jQuery。

jQuery.data 似乎只是将一段数据与一个键相关联，而我需要更多类似

id=4,setting=2
id=3,setting=1
...

我不知道列表可能有多长，它可能是空的。

有没有明智的做法？

【问题讨论】：

标签： javascript jquery list

【解决方案1】：

您可以使用数组存储列表，使用 JSON 对象存储键值对。

<div id="DIV1"></div>
<div id="DIV2"></div>
<div id="DIV3"></div>
<div id="DIV4"></div>
<table><tbody><tr id="TR1"><td><td/></tr></tbody></table>
<script type="text/javascript">
$(function() {
    $("#TR1").data("blah", [{id: 4, setting: 2}, {id: 3, setting: 1}]);
    $("#DIV1").text($("#TR1").data("blah")[0].id);
    $("#DIV2").text($("#TR1").data("blah")[0].setting);
    $("#DIV3").text($("#TR1").data("blah")[1].id);
    $("#DIV4").text($("#TR1").data("blah")[1].setting);
});
</script>

【讨论】：

【解决方案2】：

您可以将任何内容存储为 jQuery 数据，因此您可以这样做：

var myData = [ { id: 4, setting: 2 }, [ id:3, setting:1 ] };

$("#myitem").data("mydata", myData);

如果你想通过 id 选择一些东西，你可以这样做：

var myData = {};

myData[4] = 2;
myData[3] = 1;

$("#myitem").data("mydata", myData);

然后您可以像这样访问您的设置：

var value = $("#myitem").data("mydata")[3]; // returns 1

【讨论】：

值得注意的是，如果您有该元素，使用$.data(element,"mydata") 比使用$(element).data("mydata") 性能要好得多

【解决方案3】：

我现在没有太多时间来尝试它，但是与其存储一个简单的字符串作为键，为什么不存储一个对象呢？

解释 jquery 文档...

$("div").data("blah", {id: 4,setting: 2});
var myBlah = $("div").data("blah");
var id = myBlah["id"];
var setting = myBlah["setting"];

让我知道你过得怎么样。

【讨论】：

对不起 - 我应该让用户使用整个数组。我可以看到 activa 提供了相同的解决方案，但带有一个数组，并且您已经接受了它。我很高兴您已经启动并运行了一个解决方案。