所以这个的简短版本是:我可以只遍历 each() 之前的选择器的匹配元素内的元素吗？或者有没有更简单的方法来获得我想要的东西而无需 each() 循环？

我认为这会容易得多，这让我觉得我只是缺少使用 jquery 遍历元素的一些基本原则。

场景是这样的:

我有一个表格(在这种情况下很合适)，其中每个单元格都有一个文本 input。最后一个输入是只读的，应该是在该行输入的其他值的总和。我有一个非常困惑的 js 脚本，用于查找每行的总计，然后是每行总计的总计。

这是基本的 HTML:

<table>
<thead>
<tr><th>Col 1</th><th>Col 2</th><th>Col 3</th><th>Total</th></tr>
</thead>
<tbody>
<tr id="row1"><td><input type="text" /></td><td><input type="text" /></td><td><input type="text" /></td><td class="total"><input type="text" readonly="readonly" /></td></tr>
<tr id="row2"><td><input type="text" /></td><td><input type="text" /></td><td><input type="text" /></td><td class="total"><input type="text" readonly="readonly" /></td></tr>
<tr id="row3"><td><input type="text" /></td><td><input type="text" /></td><td><input type="text" /></td><td class="total"><input type="text" readonly="readonly" /></td></tr>
</tbody>
</table>

为了清楚起见，javascript 将验证输入的数据是否为数字。

因此，我为 onchange 的每个输入设置了一个事件监听器，当用户输入数据并移动到下一个单元格/输入时，它会更新总数。然后我有一个名为 updateTotal 的函数，该函数当前使用 for 循环遍历每一行，并在该循环内遍历每个单元格，最后将总单元格中的输入设置为求和.

快速说明:我包含了下面的代码，以表明我不只是在寻找帮助，并展示我所想的基本逻辑。请随意浏览或跳过这部分。它有效，不需要任何调试或批评。

这是它的样子:

function updateTotal() {
    table = document.getElementsByTagName("tbody")[0];
    allrows = table.getElementsByTagName("tr");
    grandtotal = document.getElementById("grand");
    grandtotal.value = "";

    for (i = 0; i < allrows.length; i++) {
        row_cells = allrows[i].getElementsByTagName("input");
        row_total = allrows[i].getElementsByTagName("input")[allrows.length - 2];
        row_total.value = "";

        for (ii = 0; ii < row_cells.length - 1; ii++) {
            row_total.value = Number(row_total.value) + Number(row_cells[i][ii].value);
            grandtotal.value = Number(grandtotal.value) + Number(row_cells[i][ii].value);
        }
    }
}

现在我试图用 jquery 语法重写上面的代码，但我被卡住了。我认为最好的方法是使用 each() 循环:

function findTotals() {
$("tbody tr").each(function() {
    row_total = 0; 
    $($(this) + " td:not(.total) input:text").each(function() {
        row_total += Number($(this).val());
        }); 
    $($(this) + " .total :input:text").val(row_total);
});

}

但是使用$(this) 似乎并没有按照我想的那样工作。我阅读并看到在每个循环中使用 $(this) 指向每个匹配的元素，这是我所期望的，但我不知道如何遍历该元素每个()函数。上面还省略了 grand_total 位，因为我在让 grand total 变量起作用时运气更差。我尝试了以下只是为了获得 row_totals:

 $($(this).attr("id") + " td:not(.total) input:text").each(function() {

取得了一些成功，但当我尝试添加它时设法打破了它。我认为我不需要每一行都有一个 id 来完成这项工作，因为每个部分都应该指向我想到的那一行。

所以这个的简短版本是:我可以使用 each 循环只遍历匹配项中的元素吗？如果可以，正确的语法是什么？或者有没有更简单的方法来获得我想要的东西而无需 each 循环？

哦，最后一个想法......

是否可以使用 jquery 获取所有匹配元素的数字总和(而不是一个长字符串)？我会自己对此进行更多研究，但如果有人知道，这将使其中一些变得容易得多。

最佳答案

你试图错误地设置你的上下文试试这个:

function findTotals() {
    $("tbody tr").each(function() {
        row_total = 0; 
        $("td:not(.total) input:text",this).each(function() {
           row_total += Number($(this).val());
        }); 
        $(".total :input:text",this).val(row_total);
    });

}

有关上下文的更多信息，请查看 jquery 文档:http://docs.jquery.com/Core/jQuery#expressioncontext

关于javascript - 使用 jquery 获取表的每行总计和总计，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/1360115/