jquery - 数组值求和并作为点击参数传递

Question

我有一个值数组，用于创建列表项，然后将其附加到有序列表中。

我想要的是创建一个单击函数，该函数根据列表中项目的顺序传递这些值的总和（即，如果您单击列表中的第 3 个项目，它会汇总所有前面的值并将总和传递给一个变量。

Answer 1

var jList = $("#bargraph ul").attr('class', 'bars');

我不认为这是你想要的，它试图将属性“class”设置为“bars”。如果你想添加一个类，你应该使用addClass。要选择使用类，您可以这样做：

var jList = $(".bars");

并且可以组合选择器。

Answer 2

所以只需遍历你的数组，对值求和。我们只需要知道 intIndex 就可以做到这一点，而不是 objValue。

var jList = $("#bargraph ul").addClass('bars');

// for each item in your array, create an LI
$.each(datas,function(intIndex, objValue){
    var intSum = 0, i = 0;

    for (i; i < intIndex; i++) {
        // just to make sure you don't try and access an array value out of bounds
        if (i >= datas.length) {
            break;
        }

        intSum += datas[intSum];
    }

    jList.append($("<li>"+"</li>").addClass('bar'+intIndex).css('height', objValue).attr('data-sum', intSum));
});

// for each LI, add an event listener
$("#bargraph li").on('click', function(e) {
    // here's your value
    currentSlide = $(this).attr('data-sum');
});

回想起来，有更好的方法来做到这一点。我宁愿将所有逻辑移至事件侦听器以计算总和。在这种情况下，您可以使用 jquery 选择器来获取所有 LI 的数组，循环遍历它们直到到达当前的，并将它们的高度属性相加。但就目前而言，这应该可行。