.each() 没有正确迭代

发布于 2024-12-14 07:34:28 字数 1737 浏览 1 评论 0原文

我已经在这个问题上苦苦挣扎了几个小时，但不理解我的行为。我没有在任何其他帖子中发现这个问题（尽管我发现了许多与 .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 列第一行的值进行填充。所有乘法仅使用一个值。就好像 .each() 在一列 (.absoluteResult) 上正确迭代，但在另一列 (.rentability) 上却没有正确迭代。

我不明白为什么。

原文

I have been struggling with this issue for a few hours now without understanding the behaviour I have got. I did not found this issue on any other post (although I have found many related to the .each() method).

Anyway here I am:

This is the HTML I what to iterate upon:

<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>

The idea is: the user will enter a value in the textField #investment.
onChange, JQuery will populate the .absoluteResult table column by multiplying the user input by the .rentability value.

Here is the JQuery part then:

$('#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)
        })
    })

What happens is that all .absoluteResult rows are populated using the value of the first row of the .rentability column.
Only one value is used for all the pultiplication. It is as if .each() is iterating correctly on one column (.absoluteResult) and not on the other (.rentability).

I do not understand why.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

愁杀 2024-12-21 07:34:28

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

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

尝试

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

I think the issue is in the way you are using selectors to search within each table row; instead of

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

try

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

回复收藏 0 原文

土豪我们做朋友吧 2024-12-21 07:34:28

这是有效的..

$('#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/ 的小提琴

This works..

$('#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(''); }
});

Here is the fiddle to check http://jsfiddle.net/BcjMj/

回复收藏 0 原文

撩人痒 2024-12-21 07:34:28

试试这个：

$('#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/

Try this:

$('#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);
        })
    })

code: http://jsfiddle.net/qYSAH/1/

回复收藏 0 原文

~没有更多了~