如何在DataTable中实现勾选复选框时仅统计对应文本框的数值总和

你只需要修改doSum5函数的求和逻辑，在累加前新增复选框选中状态的判断即可：

function doSum5() {
    var total = table7.column(3).nodes()
        .reduce(function (sum, node) {
            // 判断当前单元格的复选框是否勾选
            const checkBoxSelected = $(node).find('input[type="checkbox"]').is(':checked');
            // 未勾选直接返回当前累计值，不参与求和
            if (!checkBoxSelected) return sum;
            // 勾选则读取数值，同时处理非数字的异常情况
            const currentPrice = parseFloat($(node).find('input.price-input').val());
            return sum + (isNaN(currentPrice) ? 0 : currentPrice);
        }, 0);
    // 格式化后更新页脚求和结果
    const finalSum = total.toFixed(2);
    $(table7.column(3).footer()).html(finalSum);
}

额外优化建议 #

你当前列渲染逻辑里给所有输入框加了重复的id="newCost"属性，DOM规范要求id全局唯一，建议删掉这个重复id，你已经声明了price-input类名，完全可以满足元素选择需求。

原有效果参考：

内容的提问来源于stack exchange，提问作者Michaelweston