使用jquery在表格行中添加数字[重复]

Posted 2023-03-11

【中文标题】使用jquery在表格行中添加数字[重复]

【英文标题】：Adding the numbers in table row using jquery [duplicate]

【发布时间】：2015-06-27 02:31:37

【问题描述】：

我想在表格单元格中添加数字而不得到NaN。

<table id="sample" border="1">
<tr>
 <td>1</td>
 <td>2</td>
 <td>1</td>
 <td></td>
 <td>1</td>
 <td>3</td>
</tr>
<tr>
 <td></td>
</tr>
</table>

Fiddle:

这怎么可能？

【参考方案1】：

检查一下

$(document).ready(function() 
    
    var colTotal=0;
    var col=$("#sample tr td");
    
    col.each(function() 
        colData=parseInt($(this).text(), 10);

        if (colData) 
            colTotal+=parseInt(colData);
        
    );
    
    $('#sample tr:last td').text(colTotal);
									
);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<table id="sample" border="1">
    <tr>
        <td>1</td>
        <td>2</td>
        <td>1</td>
        <td></td>
        <td>1</td>
        <td>3</td>
    </tr>
    <tr>
        <td></td>
    </tr>
</table>

【参考方案2】：

使用isNaN() 函数如：

$(document).ready(function() 

    var colTotal=0;
 var col=$("#sample tr td");
    $(col).each(function()
        
                colData=$(this).text();
                colTotal+=isNaN(parseInt(colData)) ? 0: parseInt(colData);
        );
    $('#sample tr:last td').text(isNaN(colTotal) ? 0: colTotal);

);

DEMO

【讨论】：

我还需要总数。

@jackrose 查看演示。

【参考方案3】：

使用$.isNumeric(colData)updated your link

【讨论】：

几句话的解释会使这个例子更好。

【参考方案4】：

跳过空白值

$(document).ready(function() 
 var colTotal=0;
    $("#sample td").each(function()
        
            if ($(this).text())
                colTotal+=parseInt($(this).text());
        );
    $('#sample tr:last td').text(colTotal);                             
);

【讨论】：

检查小提琴jsfiddle.net/tobaxbb3/5