Question

我必须从表中的数据值属性的内容中获取总和。它在javascript中使用onclick函数逐行动态创建的表格。（每次点击都会附加一行，并将数据 - 值传递给行和文本内部的文本）。

表以这种方式开始：

<table id="franco">
<tr><th id="valore"> Total value </th></tr>
</table>

它已经填充了＃34;像这样：

<table id="franco">
<tbody>
<tr><th id="valore"> Total value</th></tr>
<tr><td class="pick" data-valore="7">Frank Zappa</td></tr>
<tr><td class="pick" data-valore="3">Mozart</td></tr>
<tr><td class="pick" data-valore="10">Roger Waters</td></tr>
<tr><td class="pick" data-valore="11">Zu</td></tr>
<tr><td class="pick" data-valore="7">Maserati</td></tr>
</tbody>
</table>

我怎样才能总结所有的勇气？＆＃34; data-valore＆＃34;并在第th行显示此结果？

编辑：每次用另一行更新的表时，该函数必须刷新总和。 onclick的id＃scelta1（id =＆＃34; scelta1＆＃34;），与其他17个div（scelta1，scelta2，scelta3 ......）上的行创建相同的功能... scelta18）。这很棘手！

编辑2：我有一个解决方案，也许对其他人来说很方便：

$(document).ready(function(){ 
$('#scelta').on('click', function () {
var sum = 0;
$(".pick").each(function(){
sum += parseInt($(this).data("valore"));
});
$('#sum').text(sum);
});
});

Answer 1

您可以使用属性data-valore查询所有元素，将它们映射到数字中，然后将它们相加。

var total = [].slice
  .call(document.querySelectorAll('#franco [data-valore]'))
  .map(el => Number(el.getAttribute('data-valore')))
  .reduce((a, b) => {
    return a + b;
  });

document
  .getElementById('valore')
  .insertAdjacentHTML('beforeend', total);

<table id="franco">
  <tbody>
    <tr><th id="valore">Total value: </th></tr>
    <tr><td class="pick" data-valore="7">Frank Zappa</td></tr>
    <tr><td class="pick" data-valore="3">Mozart</td></tr>
    <tr><td class="pick" data-valore="10">Roger Waters</td></tr>
    <tr><td class="pick" data-valore="11">Zu</td></tr>
    <tr><td class="pick" data-valore="7">Maserati</td></tr>
  </tbody>
</table>

Answer 2

您可以使用jQuery执行此操作，请检查此

＆＃13;

import csv
with open('filename.csv', 'rb') as csvfile:
    data = csv.reader(csvfile, delimiter=',')
    for row in data:
        print "------------------"
        print row
        print "------------------"
        for cell in row:
            print cell

＆＃13;

$(document).ready(function(){
var sum = 0;
  $("#franco .pick").each(function(){
    var value =  $(this).data("valore");
    sum = sum + value;
    
    $("#franco #sum").text(sum);
  });
});

＆＃13;

Answer 3

这就是我喜欢它的方式！

$(document).ready(function(){ 
$('#scelta').on('click', function () {
var sum = 0;
$(".pick").each(function(){
sum += parseInt($(this).data("valore"));
});
$('#sum').text(sum);
});
});

来自表行内data- *属性的Sum函数

3 个答案: