如何总结具有特定选择器名称的所有字段

时间:2017-04-06 10:54:25

标签: javascript jquery

我有很多跨区域,其中包含文本格式的数字。这些字段与名称singleprice-23singleprice-24singleprice-25等的第一部分相同。如何使用jQuery汇总所有这些字段?对于具有相同名称起点的输入,我怎么能这样做呢?

4 个答案:

答案 0 :(得分:1)

你可以:

  • 找到ID为singleprice
  • 的所有范围
  • 迭代每个跨度并将其值相加

见以下内容:

var spans = $('[id^=singleprice]');
var sum = 0;

spans.each(function(index, value){
  sum += +($(value).html());
});

console.log(sum);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span id="singleprice-23">100</span>
<span id="singleprice-24">200</span>
<span id="singleprice-25">400</span>

答案 1 :(得分:0)

var sum = 0;
$('[name^="singleprice"]').each(function() {
    sum += +$(this).attr('data-single-price');
});

此解决方案假定每个元素的name属性以&#34; singleprice&#34;开头。还有一个数据单一价格&#39;属性与价格的价值。变量和是所有这些值的总和。如果元素没有上述数据属性,那么您必须编写一个仅查看名称值的正则表达式。我说添加数据单价格属性是一种更简单的解决方案,但它当然取决于您的项目。

答案 2 :(得分:0)

迭代所有名称以“singleprice”开头的元素,获取文本/值,修剪它,将其转换为数字并添加到sum变量。

总结跨度:

var sum = 0;
$('[name^="singleprice"]').each(function(){
    sum += +$.trim( $(this).text() );
})

输入:

var sum = 0;
$('[name^="singleprice"]').each(function(){
    sum += +$.trim( $(this).val() );
})

答案 3 :(得分:0)

Array.prototype.reduce()Array.prototype.map()结合使用可用于计算总数:

var sum = [].map.call(document.querySelectorAll('span'), function(o) {
  return parseInt(o.textContent, 10);
}) // <----will return you the array [5,5,5,5,5]
.reduce(function(acc, val) { // <---will iterate over array and add values
  return acc + val;
}, 0);

console.log(sum);
<span>5</span>,<span>5</span>,<span>5</span>,<span>5</span>,<span>5</span>