2

我有一个表，它将为每个 tr 中的最高数字添加一个类。

我希望它跳过前 3 列而不是搜索它们。然后，如果有多个最高值，那么也加粗。

我将在这里粘贴代码以及小提琴。

HTML

    <style>
        .highest {
        font-weight: bold;
    }
    </style>

<table width="300">
    <tr>
        <th>no</th>
        <th>no</th>
        <th>no</th>
        <th>yes</th>
        <th>yes</th>
        <th>yes</th>
    </tr>    
    <tr>
        <td>150</td>
        <td>name</td>
        <td>10.5</td>
        <td>1.5</td>
        <td>12</td>
        <td>9.3</td>
    </tr>
    <tr>
        <td>12.0</td>
        <td>name</td>
        <td>150</td>
        <td>150</td>
        <td>13.5</td>
        <td>150</td>
    </tr>
    <tr>
        <td>160</td>
        <td>name</td>
        <td>115</td>
        <td>15</td>
        <td>11</td>
        <td>160</td>
    </tr>
    <tr>
        <td>145</td>
        <td>name</td>
        <td>151</td>
        <td>12</td>
        <td>18</td>
        <td>18</td>
    </tr>
</table>

JAVASCRIPT

jQuery(function($) {
    $.fn.max = function(callback) {
        var max = null,
            maxIndex = null;

        this.each(function() {
            var value = callback.call(this);
            if (+value === value) {
                if (!max || value > max) {
                    max = value;
                    maxIndex = $(this).index();
                }
            }

        });
        return max !== null ? this.eq(maxIndex) : $();
    };
}(jQuery));


$('tr').each(function() 
    $(this).children('td').max(function() {
        var value = +$(this).text();
        if (!isNaN(value)) {
            return value;
        }
    }).addClass('highest');
});

小提琴

http://jsfiddle.net/65S7N/96/

4

3 回答 3

4

只需将选择器作为参数添加到插件中，然后按此过滤：

jQuery(function($) {
    $.fn.max = function(selector) {
        var elems = $();
        this.each(function() {
            var max = 0,
                ele = $(this).find(selector).each(function(i,el) {
                var n  = parseFloat($(el).text());
                if ( n > max ) max = n;
            }).filter(function() {
                return parseFloat($(this).text()) === max;
            });
            elems = elems.add(ele);
        });
        return elems;
    };
}(jQuery));


$('tr').max('td:gt(2)').addClass('highest');

小提琴

于 2013-07-31T18:34:36.850 回答
0

要跳过前 3 列，请使用：

$(this).children('td').filter(function(i) {
    return i > 2;
}).max(...)

filter 函数接收集合中元素的从零开始的位置。

如果要突出显示具有最大值的多个条目，则maxIndex需要是一个数组，而不是单个值。当 时value === max，将当前索引压入数组。或者使它成为元素的 jQuery 集合，而不是索引，并将当前元素添加到其中。

于 2013-07-31T18:12:55.573 回答
0 
$('tr').each(function(){
    var this = $(this);
    var max = -Infinity;
    var indexes = [];
    this.find('td:gt(2)').each(function(index){
        var this_num = ($(this).text() >> 0);
        if ( max < this_num ) {
            max = this_num;
            indexes = [index];
        } else if (max == this_num ) {
            indexes.push(this_num);
        }
    });
    $(indexes).each(function(index){
        this.find('td:eq('+index+')').addClass('highest');
    });
});

应该可以工作..尚未测试：|

于 2013-07-31T18:32:20.827 回答