如何查找和更改 n 与 n 之间的乘法类n

Question

我有一些表结构：

    <tr class="row-2"><tr>
    <tr class="row-3">..<tr>
    <tr class="row-4">..<tr>
    <tr class="row-5">..<tr>
    <tr class="row-6">..<tr>
    <tr class="row-7"><tr>
    <tr class="row-8">..<tr>
    <tr class="row-9">..<tr>
    <tr class="row-10">..<tr>
    <tr class="row-11">..<tr>
...etc

对于此示例，具有类“row-2”和“row-7”的 TR 是展开子行的父产品链接。

<script>
$(function() {
    $('tr.parent')
        .css("cursor","pointer")
        .css("color","red")
        .attr("title","Click to expand/collapse")
        .click(function(){
            $(this).siblings('.child-'+this.id).toggle();
        });
    $('tr[@class^=child-]').hide().children('td');
});
</script>

行 -3...-6 是行 2 的子行 和 行-8...-11是行7的子行

我怎样才能找到行2，行7等，然后添加第二类“父”和ID类似的类（id =“row” -2”、id=“row-7”等）？另外，我需要在 row-2 和 row-7 类之间添加等于上一个父行的每个 TR 。归根结底，我需要这样的东西：

        <tr class="row-2 parent" id="row-2"><tr>
        <tr class="row-3 child-row2">..<tr>
        <tr class="row-4 child-row2">..<tr>
        <tr class="row-5 child-row2">..<tr>
        <tr class="row-6 child-row2">..<tr>
        <tr class="row-7 parent" id="row-7"><tr>
        <tr class="row-8 child-row7">..<tr>
        <tr class="row-9 child-row7">..<tr>
        <tr class="row-10 child-row7">..<tr>
        <tr class="row-11 child-row7">..<tr>
..etc

Answer 1

一种方法是对所有行执行两次传递，以设置所需的类和 ID。在第一遍中，添加与类名相同的 id，并将 parent 类添加到 row-2 和 row-7。在第二遍中，找到每个 .parent 行，并将 child- 类添加到其同级，直到下一个父级。这不是对 row-2 和 row-7 的值进行硬编码，而是假设所有标头项都包含在 元素内，而不是 < /代码> 元素。

这是一些代码： http://jsfiddle.net/vYTW2/

/**
 * Do a two pass on all rows to set them up.
 * In the first pass, add the same id as class, and
 * add the "parent" class to the row.
 *
 * Assuming all product header rows contain a
 * <th> element
 */
$('table tr th').each(function() {
    var row = $(this).parent('tr');
    var id = row.attr('class');
    row.attr('id', id);
    row.addClass('parent');
});

/**
 * In the second pass, run through all header rows
 * (that have the class parent) and mark all next siblings
 * with class "child-rowX" until we see the next parent row.
 */
$('tr.parent').each(function() {
    var id = $(this).attr('id');
    var className = 'child-' + id;
    $(this).nextUntil('.parent').addClass(className);
});