Question

我在CMS中工作，几乎无法控制HTML。我依靠jQuery来操作这个表。我的客户想要为每一行替换标题和图像。

所需的布局看起来有点像这样：

[Image][Title]
[Title][Image]
[Image][Title]
[Title][Image]

这是我正在使用的简化版本：

<tbody>
<tr class="odd">
    <td class="views-field-title"></td>
    <td class="views-field-field-services-image-fid"></td>
    <td class="views-field-value0"></td>
</tr>
<tr class="even">
    <td class="views-field-title"></td>
    <td class="views-field-field-services-image-fid"></td>
    <td class="views-field-value0"></td>
</tr>
<tr class="odd">
    <td class="views-field-title"></td>
    <td class="views-field-field-services-image-fid"></td>
    <td class="views-field-value0"></td>
</tr>
<tr class="even">
    <td class="views-field-title"></td>
    <td class="views-field-field-services-image-fid"></td>
    <td class="views-field-value0"></td>
</tr>
</tbody>

我是jQuery的新手，并且一直在努力使用.each（）函数。这是我能够得到的：

$(".views-field-title").after($(".views-field-field-services-image-fid"));

Answer 1

你可以这样做来改变赔率的顺序，只需改变孩子的顺序

 $(function() {
        jQuery.each($(".odd"), function() { 
            $(this).children(":eq(1)").after($(this).children(":eq(0)"));
        });
    });

这是小提琴的工作原理。 http://jsfiddle.net/77pHb/

Answer 2

怎么样：

$("tr.odd .views-field-field-services-image-fid").after(function () {
    return $(this).prev();
});

这是发生了什么：

选择器返回每个奇数表行的每个“图像”列。
.after函数可以执行某个功能。该函数对jQuery对象中的每个项执行一次。
在我们传递给.after的函数内部，我们将在我们迭代的当前项之后返回我们想要插入的元素。在我们的例子中，我们希望元素直接位于我们正在查看的元素之前（“title”元素）。我们可以使用.prev检索它。

示例： http://jsfiddle.net/6zAN7/10/

对于每个奇数表行，使用jQuery切换表格单元格

2 个答案: