在列表中创建所选项的数组并显示其JSON数据

时间:2014-09-01 22:54:07

标签: javascript jquery arrays json

我尝试执行看似简单的任务,并为JSON对象中的每个项目显示<li>。然后,当我单击每个显示的项目时,从所有选定的项目中获取其他JSON信息,并创建一个存储在变量中的数组以供以后使用。

这是我的JSON。没有什么疯狂,简单的数据阵列。

[
  {
    "subCategory": "Foo",
    "total": 100,
    "converted": 25,
    "revenue": 500
  },
  {
    "subCategory": "Bar",
    "total": 100,
    "converted": 25,
    "revenue": 1000
  }
]

使用我的JS(使用jQuery),我正确地获取并显示每个项目,但是当我选择要显示的项目时,我没有得到我想要的数据。在下面的JS中,我意识到除了在显示的li中添加类之外没有做太多的事情,但是我仍然坚持如何获取每个所选项的数据并重写以下变量。

(function(){

    $('.bubbles').on('click', 'li', function(){
        $(this).toggleClass('selected');
    });

    $.getJSON('data.json', function(data) {
        $.each(data,function(i, value){
            // Display bubbles
            $('.marketingBubbles').append("<li class='"+ value.leads + " "+ value.status + " "+ value.lift + "'>");

            // Get data and create arrays
            var totalArray = [value.total], // Get values from all totals
                convertedArray = [value.converted], // Get all values from converted
                revenueArray = [value.revenue]

            // Add up numbers in arrays
            var totalConverted = eval(convertedArray.join('+')), // Sum of all converted leads
                totalLeads = eval(totalArray.join('+')), // Sum of all total leads
                totalRevenue = eval(indicatorRevenue.join('+')) // Sum of all revenue    

        });
    });


})();

HTML

<ul class="marketingBubbles"></ul>

最终,我想取一个数组中的值,无论它被改变了多少次,用数据执行一些简单的数学运算,并在屏幕上的各种div中显示。

任何帮助都将不胜感激。

谢谢!

0 个答案:

没有答案