Question

我有一个数字值表，它的单元格。

我的目标是通过点击表格单元格并获取它们的值，但在我点击时随意添加它们。它应该跟踪总和并将其显示在单独的div。

中

我编写的代码处理单击td并添加了一个类，其中包括更改背景颜色，以便用户可以看到他到目前为止所点击的内容。因为正在添加类，所以我使用live()。

然后我想动态检查拥有新课程的td（名为selecting）并将其添加。

这是我到目前为止的代码，但是，首先它不会添加它们，而是一个接一个地追加，并且还有一些奇怪的顺序：

$(document).ready(function() {
    total = '';

    $('td').click(function() {
        $(this).toggleClass('selecting');
        $('.selecting').live( {
            click: function() {
                if ($('td').hasClass('selecting')) {
                    total += $(this).html();
                }
            }
        })
        $('#feedback').text(total);
    });
})

一个后续步骤是，再次点击被点击的td时，会减去总和再次点击的单元格的值。因此，如果新点击，添加，如果再次点击，减去，但这就像第二步，我很难一次完成所有操作。

Answer 1

total += +$(this).text();

将字符串添加到另一个字符串时，您将连接。如果您想添加，则需要使用数字。 +将字符串更改为数字。

另外，更改total = '';的{{1}}。

Answer 2

试试这个：

$('td').click(function() {
    var $td = $(this);
    var total = 0;
    $td.toggleClass('selecting');

    $(".selecting").each(function() {
       total += parseInt($(this).text(), 10);
    });

    $('#feedback span').text(total);
});

Example fiddle

您会在代码中看到，对于每次点击，它会完全重新计算总数，这样就无需在点击之间存储总数，这样您就可以减去点击的值。它使逻辑变得更加简单。

此外，我首先删除了live()，因为live()现已弃用，不应使用，其次是因为您不需要使用它。

从表格单元格中添加值

2 个答案: