使用 JSON jquery every() IF 语句显示每月的项目数（for 循环？）

Question

我有一个 JSON 数据对象，其中包含按月列出的商品及其销售额。我想在 DIV 中列出每月的商品销售额以及有关每个商品的其他信息。

这是我的 JSON 对象：

var my_object= [{"item_id":"11","month":"February","sales":"7"}, {"item_id":"4","month":"February","sales":"2"},{"item_id":"11","month":"March","sales":"1"},{"item_id":"4","month":"March","sales":"2"}]

这是我希望最终 HTML 的外观：

<ul><li><button value="4">item_id_4</button><div>where the item_4 sales/month (i.e., 2,2) should go</div></li>
<li><button value="11">item_id_11</button><div>where the item_11 sales/month (i.e, 7,1) should go</div></li></ul>

最后，这是我尚未正确的 jquery/javascript 尝试显示项目计数/月。

$(function(){   
$('button').each(function(){

var my_object = [{"item_id":"11","month":"February","sales":"7"},  {"item_id":"4","month":"February","sales":"2"},{"item_id":"11","month":"March","sales":"1"},{"item_id":"4","month":"March","sales":"2"}];

var button_value=$(this).val();

 $.each(my_object, function(i,item){

  if(item.item_id==button_value){       
    $('div').append(item.sales);
        } 

    });
}); 
});

按照目前的情况，该脚本显示每个 div 中两个商品的销售额，即 2,2,7,1，而不是仅在各自的 item_id_4 和 item_id_11 div 中分别显示 2,2 和 7,1。这使得 if 语句看起来至少做了一些正确的事情，因为“my_object”项目销售是按按钮值的顺序列出的，而不是按照“my_object”中的顺序列出的。

我不确定问题是否出在each() 函数、IF 语句，或者可能是这里未提及的其他问题。任何修复此脚本的帮助将不胜感激！

Answer 1

除了附加行之外，您的脚本似乎工作正常，您告诉 jQuery 选择页面上的所有 div 并将销售数据附加到它们。显然这不完全是你想要的。 :)

使用当前的 HTML 结构，更改该行以选择下一个 div 似乎可行。 （我还将当前按钮保存在 $this 中。）

$this.next("div").append(item.sales);

此处代码 http://jsfiddle.net/meloncholy/ ZhrZU/

Answer 2

尝试以下

$(function(){   

    var my_object = [{"item_id":"11","month":"February","sales":"7"},  {"item_id":"4","month":"February","sales":"2"},{"item_id":"11","month":"March","sales":"1"},{"item_id":"4","month":"March","sales":"2"}];

    for (var i in my_object) {
        var cur = my_object[i];
        $('button[value=' + cur.item_id + ']').each(function() {
            var msg = 'Sales Month: ' + cur.month + ' Number: ' + cur.sales;
            $(this).parent().append('<div>' + msg + '</div>');
        });
    }
});

我不太确定你想要的凝视 HTML 是什么，但我假设以下

<ul><li><button value="4"></button></li>
<li><button value="11"></button></li></ul>

小提琴： http:// jsfiddle.net/HdgmN/