将json存储为变量以便在另一个函数中重用

Question

我正在学习jQuery，我想知道如何重新使用ajax json数据，而无需再发出第二个请求。

e.g。

分类选择框：

<select id="Categories">
    <option value="Vegetables">Vegetables</option>
    <option value="Fruits">Fruits</option>
</select>

使用jQuery("#Categories").change(function(){...更改类别时，ajax调用get请求会提取以下ajax数据。

[{"Id":"1","Item":"Apples","PricePerKilo":"10.00"},
 {"Id":"3","Item":"Oranges","PricePerKilo":"12.00"}]

然后产品选择框更新如下：

<select id="Products">
     <option value="1">Apples</option>
     <option value="3">Oranges</option>
</select>

现在我要做的是，有一个所需重量的输入框。这样，当输入#weight的值发生变化时，总标签也会随价格更新。

jQuery('#weight').bind('input', function() { 
   jQuery("#total").text( "£ " + (jQuery('#weight').val() * SOMETHING ).toFixed(2) ); 
)};

注意SOMETHING ......这应该是......

data.PricePerKilo WHERE data.Id = jQuery("#products").val();

关于如何使json数据可重用的任何想法？

Answer 1

您可以将任意数据与带有.data()的DOM元素相关联。在获取JSON之后使用以下内容存储它：

jQuery("#products").data('productData', myData);

然后用这个检索它：

var myData = jQuery("#products").data('productData');