1

在以下代码中:http: //jsfiddle.net/ueP5U/1/

我有一个表,其中每个 td/th 成员都由其给定一个相对索引<tr>

var tableIterator = function(table, process) {
$.each(table.children(), function() { //cycle through thead,tbody,tfoot
    $(this).children().each(function() { //cycle through thead, tbody, tfoot "tr"s
        process.call($(this));
    });
});
}



tableIterator($("table"), function() {
  $(this).find("td,th").each(function() {
    $(this).text("Index: " + $(this).index()); 
  });
});

​</p>

该表可以包含两个或多个标题,其中父标题获得更大的 colspan 并且底部标题通过提供等效数量的列来符合(即索引 4 有两个索引为 1 和 2 的子标题)。

我实际上想要做的是制作父标题,选择它的所有“孩子”(当然不是实际的 dom 孩子),并根据所选列进行相同的操作。

我明白了逻辑:每个标题元素,需要找到它以前的兄弟“孩子”索引,并将 colspan 的数量添加到它自己的孩子以获得他们的索引(即索引 5 [colspan = 2],去索引 4,找到它的最后一个孩子(索引 1))并将 colspan 的数量添加到它的“孩子”中,所以他们将拥有 index: 2 和 index: 3 (+=1*colspan.val() 次)

它的身体“孩子”也是如此。

我假设我需要根据使用 jQuery.filter(return $("thead").findByColumn(2[或任何其他顶部标题索引])) 显示的内容创建一个包含绑定元素的对象数组

希望得到一些帮助,因为我什至在开始时都遇到了麻烦,通过单击突出显示、通过 max_width 隐藏或根据选择在列上运行的示例非常受欢迎!

4

1 回答 1

0
function iterTable(table, callback) {
    // Keeps track of which indices are blocked by larger cells
    var blocked = [];

    $("thead,tbody,tfoot", table).each(function (groupIndex) {
        var groupName = this.tagName;

        $("tr", this).each(function (rowIndex) {
            var colIndex = 0;
            var blockedRow = blocked[0] || [];

            $("td,th", this).each(function () {
                var $cell = $(this);
                var colSpan = parseInt($cell.prop("colspan")) || 1;
                var rowSpan = parseInt($cell.prop("rowspan")) || 1;

                // Skip all blocked cells
                while (blockedRow[colIndex]) {
                    colIndex++;
                }

                callback(groupIndex, groupName, rowIndex, colIndex, $cell);

                // Mark all sub-cells as blocked.
                for (var i = 0; i < rowSpan; i++) {
                    for (var j = 0; j < colSpan; j++) {
                        if (!blocked[i]) blocked[i] = [];
                        blocked[i][colIndex+j] = true;
                    }
                }
                colIndex += colSpan;
            });

            // Pop the first element; We don't need it any more.
            blocked.shift();
        });
    });
}

var columns = [];
iterTable($('table'), function (groupIndex, groupName, rowIndex, colIndex, $cell) {
    $cell.text(groupName + " " + rowIndex + "," + colIndex);
    if (groupName == "TBODY") {

        // Save the cell into a specific column.
        if (!columns[colIndex]) columns[colIndex] = [];
        columns[colIndex][rowIndex] = $cell;

    }
    else { // THEAD or TFOOT

        var colSpan = parseInt($cell.prop("colspan")) || 1;
        $cell.click(function () {
            // Toggle the background for the column under the header.
            for (var i = 0; i < colSpan; i++) {
                $.each(columns[colIndex+i], function () {
                    $(this).toggleClass('selected');
                });
            }
        });

    }
});

(jsfiddle)

于 2012-11-08T00:04:23.757 回答