.each() 没有正确迭代答案

【问题标题】：.each() not iterating properly.each() 没有正确迭代
【发布时间】：2011-12-25 13:29:00
【问题描述】：

我已经在这个问题上苦苦挣扎了几个小时，但不了解我的行为。我在任何其他帖子上都没有发现这个问题（尽管我发现许多与.each() 方法相关）。

反正我在这里：

这是我要迭代的 HTML：

<input type="text" id="investment" /><br />
<table id="fundTable">
        <tr> 
             <td class="rentability"> <span class="someClass"> 0.12 </span> </td>
             <td class="absoluteResult"></td>
        </tr>
        <tr> 
             <td class="rentability"> <span class="someClass"> 0.24  </span> </td>
             <td class="absoluteResult"></td>
        </tr>
        <tr>
            ...
</table>

这个想法是：用户将在文本字段#investment 中输入一个值。 onChange，JQuery 将通过将用户输入乘以 .rentability 值来填充 .absoluteResult 表列。

这里是 JQuery 部分：

$('#investment').change(function() {
        var investment = $('#investment').val(),
            currentlyDisplayedRentability,
            updatedAbsoluteResult

        $('#fundTable tr').each(function(index, tableRow) {
            currentlyDisplayedRentability = $(tableRow + "span").html()
            currentlyDisplayedRentability = parseFloat(currentlyDisplayedRentability)
            updatedAbsoluteResult = currentlyDisplayedRentability * investment
            $(tableRow + "td[class=absoluteResult]").html(updatedAbsoluteResult)
        })
    })

发生的情况是所有.absoluteResult 行都使用.rentability 列的第一行的值填充。所有的 pultiplication 只使用一个值。就好像.each() 在一个列 (.absoluteResult) 上正确迭代，而不是在另一列 (.rentability) 上。

我不明白为什么。

【问题讨论】：

我在您的代码中没有看到 ID 为 #fundTable 的表格/tbody。所以这没有任何意义：$('#fundTable tr').each( ... );
tableRow 变量不是字符串，它是当前元素。您的意思可能是 $("span", tableRow) 或 $(tableRow).find("span")。
@biziclop 是对的。这里发生的情况是您没有执行足够的分而治之的调试，因此得出了each 没有正确迭代的结论，事实上，您完全依赖于用于测试该迭代的复杂代码。如果该代码有问题（确实有问题），那么您的整个测试就会中断。相反，您应该让console.logged 一些关于.each 内部当前对象的信息，以排除迭代问题是导致问题的原因。
您还在选择 ID 为“fundTable”的表格 - 我在您的 html 示例中没有看到这样的表格。

标签： jquery loops html-table jquery-selectors each

【解决方案1】：

我认为问题在于您使用选择器在每个表格行中进行搜索的方式；而不是

$(tableRow + "span").html()

试试

$(tableRow).find("span").html()

【讨论】：

【解决方案2】：

这行得通..

$('#investment').bind('keyup', function() {
var a = $(this).val();
if (!isNaN(parseFloat(a)) && isFinite(a)) {
    $('table tr').each(function() {
        var x = $(this).find('td.rentability .someClass').html();
        $(this).find('.absoluteResult').html(x * a);
    });
}
else { $('.absoluteResult').html(''); }
});

这是检查http://jsfiddle.net/BcjMj/的小提琴

【讨论】：

【解决方案3】：

试试这个：

$('#investment').change(function() {
        var investment = parseFloat($('#investment').val());

        $('table tr').each(function() {
            var $tr = $(this);
            var rentability = parseFloat($tr.find('.someClass').text());

            $tr.find('.absoluteResult').html(investment * rentability);
        })
    })

代码：http://jsfiddle.net/qYSAH/1/

【讨论】：