Question

我有一个像这样的HTML结构：

<tr class="v65-productDisplay-row"></tr>
<tr class="v65-productDisplay-row PriceAndButton"></tr>
<tr class="v65-productDisplay-row PhotoLine"></tr>
<tr class="v65-productDisplay-row"></tr>
<tr></tr>
<tr class="v65-productDisplay-row"></tr>
<tr class="v65-productDisplay-row PriceAndButton"></tr>
<tr class="v65-productDisplay-row PhotoLine"></tr>
<tr class="v65-productDisplay-row"></tr>
<tr></tr>
<tr class="v65-productDisplay-row"></tr>
<tr class="v65-productDisplay-row PriceAndButton"></tr>
<tr class="v65-productDisplay-row PhotoLine"></tr>
<tr class="v65-productDisplay-row"></tr>
<tr></tr>
...and so on

我正在尝试定位每个PriceAndButton TR并在每个相应的PhotoLine TR之后插入它。这是我到目前为止的代码，但它还没有工作：

        jQuery(".PriceAndButton").each(function() {
            var IndexValue = $(this).index();
            $(this).insertAfter(".PhotoLine:eq(" + IndexValue + 1 + "");
        });

我的想法是获取每个PriceAndButton元素的索引值，并将其插入到PhotoLine TR之后，其eq等于索引值+ 1.这应该正常，因为PhotoLine TR总是紧跟在之后？

Answer 1

你的代码（我修正了右括号）：

".PhotoLine:eq(" + IndexValue + 1 + ")";

将连接为字符串。如果IndexValue等于3，那么您将获得字符串.PhotoLine:eq(31)而不是.PhotoLine:eq(4)。你的意思是：

".PhotoLine:eq(" + (IndexValue + 1) + ")";

但即使这样，它也行不通。

为简单起见，您可以完全避免使用eq，而是选择.next('.PhotoLine')（或仅.next()，但我希望能够准确避免意外的惊喜）：

$('.PriceAndButton').each(function(i,el) {
    $(this).insertAfter($(this).next('.PhotoLine'));
});

http://jsfiddle.net/mblase75/YWaYN/

Answer 2

您可以像这样使用jQuery next method：

$(".PriceAndButton").each(function() {
    var self = $(this);
    self.insertAfter(self.next());
});

jQuery逐个定位和移动特定元素

2 个答案: