我有一张桌子:
<table>
<tr>
<th>Name</th>
<th>Id</th>
<th>Value</th>
</tr>
<tr>
<td>Ankaran</td>
<td>101</td>
<td>91</td>
</tr>
<tr>
<td>Ljubljana</td>
<td>102</td>
<td>213</td>
</tr>
<tr>
<td>Celje</td>
<td>103</td>
<td>711</td>
</tr>
<tr>
<td>Portorož</td>
<td>104</td>
<td>121</td>
</tr>
</table>
我想从最后一列(“值”)获取两个最低值,并使用这两个值为td标记着色。什么代码可以实现这个?
我试过了:
$(document).ready(function(){
$("#btnSelect").click(function(e) {
e.preventDefault();
var values= new Array();
$('tr').each(function () {
var sorted = $(this).find('td:last').html();
values.push(sorted);
});
console.log(values);
});
});
我得到了最低价值,但就我所知,我不认为这是一个强有力的解决方案
答案 0 :(得分:4)
首先,检查 Fiddle Demo
考虑一下你的HTML,这是我的css&amp; js解决方案:
<强>的javascript 强>
var tds = $('td.value');
var arr = $.makeArray(tds);
arr.sort(function(a,b){
return parseInt($(b).text()) - parseInt($(a).text());
});
$(arr[arr.length-2]).addClass('lowest');
$(arr[arr.length-1]).addClass('lowest');
<强> CSS 强>
td.lowest {background-color:lightgreen;}
答案 1 :(得分:2)
var ok = $('table tr td:last-child').map(function () {
return $(this).text();
}).get().sort(function (x, y) {
return x - y
});
alert(ok[0] + ' - is the smallest');
alert(ok[1] + ' - is the 2nd smallest');
答案 2 :(得分:1)
尝试
var map = {}, array = [];
var $tds = $('table tr').slice(1).find('td:last-child').each(function () {
var value = +$(this).text();
if (map[value]) {
map[value].push(this);
} else {
map[value] = [this];
array.push(value);
}
})
array.sort(function(a1, a2){
return a1 - a2;
});
$tds.filter(function () {
return $.inArray(+$(this).text(), array) < 2;
}).css('color', 'red')
演示:Fiddle
答案 3 :(得分:1)
var values = [],
tds = $("table tr").find("td:last");
tds.each(function(){
$(this).data("val",$(this).text());
values.push(parseInt($(this).text()))
})
values.sort(function(x,y){return x > y});
tds.each(function(){
if($(this).data("val") == values[0] || $(this).data("val") == values[1])
$(this).css("color","red");
})
值[0]和值[1]分别是最小值和第二小值。
答案 4 :(得分:1)
这应该可以解决问题: -
var values = $('td:last-child').sort(function(a, b) {
return $(a).text() - $(b).text();
}).slice(0, 2).css('color', 'red').map(function() {
return $(this).text();
}).get();
因此,请将每个td:last-child
按其text()
值(从低到高)排序,然后使用slice()
获取前两个元素。将css()
应用于这些元素,然后使用map()
返回text()
,var values
将分配给{{1}}
答案 5 :(得分:0)
好的我会使用speaky的排序功能,然后从Arun的答案中提取.filter
函数,或者只是
$(this).attr('style', 'color:red;')
或任何你想要的颜色,以突出细胞, 或者如果你想突出整行,你可以去
$(this).parent().attr('style', 'color:red;')