Jquery - 多次将类应用到最高值

Question

我有以下表结构，其结果来自两个单独的 php 查询。

<tr>
<td>Item 1</td>
<td>&pound;<?=$row1['item_1']?></td>
<td>&pound;<?=$row2['item_1']?></td>
</tr>
<tr>
<td>Item 2</td>
<td>&pound;<?=$row1['item_2']?></td>
<td>&pound;<?=$row2['item_2']?></td>
</tr>
<tr>
<td>Item 3</td>
<td>&pound;<?=$row1['item_3']?></td>
<td>&pound;<?=$row2['item_3']?></td>
</tr>

我想做的是在每一行中突出显示从数据库中提取的最高数字。

任何帮助表示赞赏！

更新

我已将以下代码添加到页面中，但我一生都无法让它工作。我可以看到它在 jsFiddle 上运行，但我一定做错了什么。请帮忙

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js "></script>
<script type="text/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().substr(1);
        if (!isNaN(value)) {
            return value;
        }
    }).addClass('red');
});
</script>

Answer 1

假设您有格式为 x.xx:

更新： 的数字，我可能会更好地为此创建一个插件。类似于：

(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().substr(1);
        if (!isNaN(value)) {
            return value;
        }
    }).addClass('highlight');
});

DEMO

---

Old答案：

$('tr').each(function() {
    var $tds = $(this).children('td'),
        max = null,
        maxIndex = null;

    $tds.each(function() {
        var value = +$(this).text().substr(1);
        if(!isNaN(value)) {
            if(!max || value > max) {
                max = value;
                maxIndex = $(this).index();
            }
        }
    });
    if(maxIndex !== null) {
        $tds.eq(maxIndex).addClass('highlight');
    }
});

DEMO

Answer 2

你可以这样做（但我认为可以做得更好）：

Array.max = function(array) {
    return Math.max.apply(Math, array);
};

Array.keyPosition = function(array, value) {
    for (i = 0; i < array.length; i++) {
        if (array[i] === value) {
            return i;
        }
    }
    return false;
}


$('table tr').each(function() {
    var numbers = [];
    $(this).children('td').each(function(i, el) {
        var number = parseInt($(this).text(), 10);
        if (isNaN(number)){
            number = -1;
        }
        numbers.push(number);
    });
    var max = Array.max(numbers);
    var index = Array.keyPosition(numbers, max);
    $(this).find('td:eq('+index+')').css('background-color', 'yellow');

});

在这里小提琴： http://jsfiddle.net/nicolapeluchetti /DYUaP/