2017-03-31 51 views
1

我有以下列表:jQuery的过滤器来选择前两个,然后接下来的两个

<li class="list one" data-number="2"></li> 
<li class="list one" data-number="2"></li> 
<li class="list two" data-number="3"></li> 
<li class="list two" data-number="7"></li> 

,我需要从data-number属性通过每个值基于列表类变量。

我有这些功能是:

var list_one = 0; 
var list_two = 0; 

$(".one").each(function (i, val) { 
    var number = $(this).data('number') 
    list_one = list_one + parseInt(number); // Gives 4 
}); 

$(".two").each(function (i, val) { 
    var number = $(this).data('number') 
    list_two = list_two + parseInt(number); // Gives 10 
}); 

但是随着列表的增长,这将成为一个漫长而混乱的代码。从前两个li得到值,然后是下一个等等,并将总和传递给变量,最好的方法是什么?

该列表将始终具有此结构,因此我不需要对每个类的li s的数量进行调整。

回答

3

您可以获得总和值的对象:

var result = {}; 
 

 
$('.list').each(function(idx, ele) { 
 
    var key = ele.classList.toString().replace(/ /g, '_'); 
 
    result[key] = (+result[key] || 0) + +ele.dataset["number"]; 
 
}); 
 

 
console.log(result);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 

 
<ul> 
 
    <li class="list one" data-number="2">one</li> 
 
    <li class="list one" data-number="2">one</li> 
 
    <li class="list two" data-number="3">two</li> 
 
    <li class="list two" data-number="7">tow</li> 
 
</ul>

0

我相信这会工作,这样可以节省每两个数字的总和。因此,如果您有20个元素,listValues的长度将为10

var listValues = []; 
$('li.list').each(function(i, val){ 
    if (i % 2 == 0) { 
     listValues[] = parseInt($(this).data('number')); 
    } else { 
     listValues[listValues.length - 1] += parseInt($(this).data('number')); 
    } 
});