Question

我已经为我想要完成的事情建立了一个简单的例子。 http://jsfiddle.net/helpinspireme/ejHFf/我想做的是

计算表格<tr>
如果表格少于6，则全部获得课程red
如果超过5但少于11，则前5个获得课程red，其余为black
如果超过10，请将类red添加到前5个，然后将最后5个添加到black类。前5和后5之间的行没有上课。

任何帮助将不胜感激。

Answer 1

你做了什么？你几乎描述了整个算法。只需使用slice获取索引和length之间的元素即可获取项目数。要添加课程，请使用addClass。

Answer 2

你想要

    if (x < 6) {
        $(tooltips_id).addClass('red');
    } else if (x > tooltips_amount-5) {
        $(tooltips_id).addClass('black');
    } else {
        // else
    }

Answer 3

这不完全是您问题的答案，因为您可能因为支持旧浏览器等原因而需要这一点（尤其值得注意的是IE仅支持我的解决方案，从版本9开始）。虽然出于同样的原因可能不使用此解决方案，但我认为重要的是要注意，通过更新的标准，您甚至可以在不使用任何Javascript的情况下执行此操作。你只有CSS：

tr
{
    border: 1px solid #000;
}

tr:nth-child(-n+5)
{
    border: 1px solid red;
}


tr:nth-last-child(-n+5)
{
    border: 1px solid red;
}

Answer 4

尝试这样的事情：

$("tr:lt(5)").css({ backgroundColor : "blue" });
$("tr:gt(5)").css({ backgroundColor : "red" });

这是jsFiddle

Answer 5

这是一个小提琴 http://jsfiddle.net/9fmNG/

var rows = $('table tr');

rows.map(function( index, row){
    var allRows  = rows.size();

    if(index+1 <= 5)
        $(row).addClass('red');
    else if((index+1) >= (allRows-5)){
        $(row).addClass('black');    
    }               
})

Answer 6

var tooltip = function() {
    var tooltips_tr = $('#primary_table tr');
    var tooltips_amount = $(tooltips_tr).length;

    tooltips_tr.each(function(i){
        i+=1;
        if(tooltips_amount < 6) $(this).addClass('red');
        if(tooltips_amount > 5 && tooltips_amount < 11)
        {
            if(i<=5) $(this).addClass('red');    
            else $(this).addClass('black');
        }
        if(tooltips_amount > 10)
        {
            if(i<=5) $(this).addClass('red');    
            else if(i>tooltips_amount-5) $(this).addClass('black');
        }
    });
}

Example.

将类应用于前5行和后5行

6 个答案: