5

我有以下结构的数据：

唯一 ID (int) | 名字（字符串）| 姓氏（字符串）| 百分比（双）

一组数据可能如下所示：

1 | 约翰 | 汉考克 | 49.5
2 | 约翰 | 汉考克 | 95.0
3 | 简 | 汉考克 | 89.5
4 | 简 | 汉考克 | 73.5
5 | 简 | 汉考克 | 96.5
6 | 弗雷德 | 燧石 | 45.8

我需要将这些数据存储在客户端，以便浏览器可以访问它并且可以使用 jQuery 进行操作。

例如，我在页面上有一个下拉菜单（选择），其中包含三个值：

1) 低百分位数
2) 中百分位数
3) 高百分位数

当用户在下拉列表中选择一个值时，我需要能够从我上面的数据中选择符合所选值的项目。例如，如果他们选择 Low Percentile 值，那么我需要从数据中检索百分比小于 60% 的所有项目。

我对 jQuery 相当多才多艺，但我从来没有用它来存储任何用于客户端检索的此类内容。我可以以某种方式将这些数据存储在客户端的 JSON 对象中，然后可以随意选择和操作吗？

4

4 回答 4

2

所以基本上：

var javascriptObject = $.parseJSON(jsonString);

var jsonString = JSON.stringify(javascriptObject);

JavaScript 很像任何其他 OOP。

var foo = {}; //NEW Object
foo.bar = 1;
foo.bars = 2;
foo.bar.date = 3;
var jsonString = JSON.stringify(foo);
//jsonString is now a "JSON Object" that holds the data found in object foo.
console.log(jsonString); //To see what it looks like.

但是，如果所有这些都是为了客户端使用，请坚持使用 JavaScript 对象。无需将它们转换为 JSON。JSON 对象实际上是用于将数据发送到其他源，因为它们是字符串。通常用于 AJAX 请求。

根据评论进行编辑

$(document).ready(function(){
    var globalObject = {};
    globalObject.foo = 1;
    globalObject.bar = 2;

    $(el).change(function(){
        globalObject.foo = $(this).val();
    });
});
于 2013-03-12T15:46:39.777 回答
2

JSON 代表 Javascript 对象表示法。如果您熟悉 Objects，您应该能够使用它。

对于您的示例，我可能会将变量保存为对象数组（因为它首先编号）。希望您不介意将数字重新分配给从零开始的增量（0、1、2...）。

如果你想在客户端保存它，也许你可以做这样的事情：

var data = [
{ fname : "John", lname : "Hancock", value : 49.5 },
{ fname : "John", lname : "Hancock", value : 95.0 }
];

这只是前两个作为示例。然后，您可以使用 for 循环遍历数组for(var i=0, count = data.length; i < count; i++)，并对数据执行某些操作 if data[i].value < 60。

jQuery 有一个很好的函数，叫做.each()，你也可以很容易地使用它。此外，如果需要，您可以将 JSON 保存在 .json 文件中并由jQuery.getJSON()调用。两者都可能是了解这一点的良好开端。

于 2013-03-12T15:51:16.640 回答
1

虽然我对这个答案并不感到自豪，但它可能会满足您的需求。它也不需要浏览器具有 HTML5 本地存储。

<input type="hidden" id="json_data" />

<script type="text/javascript>
    var theData = [
        {
            id: 1,
            firstName: 'John',
            lastName: 'Hancock',
            pct: 49.5
        },
        // other objects
        {
            id: 6,
            firstName: 'Fred',
            lastName: 'Flintstone',
            pct: 45.8
        }
    ];
    var dataAsJsonString = JSON.stringify(theData);
    $('#json_data').val(dataAsJsonString); // store data in hidden field

    // later on...
    var getDataBackOut = $.parseJSON($('#json_data').val());
    // you can now iterate over the array to find what you need
</script>
于 2013-03-12T15:56:31.600 回答
0 
var foo = localStorage.getItem("bar");
// ...
localStorage.setItem("bar", foo);

使用 HTML5 本地存储

于 2013-03-12T15:46:00.080 回答