jQuery计数tr在td中有一些条件 [英] jQuery count tr with some condition in td

问题描述

我有一张桌子，里面有6个以上的表格。每个 tr 包含6 td 。
每个 td 都有一个数据名属性：完成 code>或未完成。

我需要检查哪个 tr 有5 td ，其中数据名称属性设置为完成。

如果该行有5个已完成 td 的集合，那么 tr 应该是绿色的。

HTML

 < table id =workflowviz> 
< tr class =row> 
< td data-name =step1> 0< / td> 
< td data-name =stage：completed> 1< / td> 
< td data-name =stage：completed> 2< / td> 
< td data-name =stage：completed> 3< / td> 
< td data-name =stage：completed> 4< / td> 
< td data-name =stage：completed> 5< / td> 
< / tr> 
< tr class =row> 
< td data-name =step2> 0< / td> 
< td data-name =stage：completed> 1< / td> 
< td data-name =stage：not completed> 2< / td> 
< td data-name =stage：not completed> 3< / td> 
< td data-name =stage：not completed> 4< / td> 
< td data-name =Sub Stage：New> 5< / td> 
< / tr> 
< / table> 
  

JS

我写过代码下面是基于 data-name 属性的第一行。但是希望避免对jQuery循环中的每一行执行此操作。

  $（document）.ready（function（ ）{
 step1 =（$（td [title | ='step1']）
 .parents（）
 .children（td [title | ='stage：completed'] ）.length）; 
 
 // alert（number of step1 =+ step1）; 
 
 if（step1 == 5）{
 
 // alert（Step 1 Done）; 
 $（td [title | ='step1']）
 .parents（）
 .addClass（done_colorgreen） ; 
} 
 else {} 
}）; 
  

解决方案

我用你的代码为你创建了一个jsFfiddle。 。

代码： -

  $（文件）.ready（ function（）{
 $（table tr）。each（function（）{
 if（$（this）.find（td [data-name ='stage：completed']） .length == 5）
 $（this）.addClass（green）
}）
}）; 
  

并且它的表现也不错。

工作示例： -
http://jsfiddle.net/BtkCf/172/

要查看其性能，请参阅此链接并打开控制台查看此代码所用的时间。
http://jsfiddle.net/BtkCf/173/

谢谢

I have a table with 6+ table rows. Each tr contains 6 td's. Each td has a data-name attribute of either: completed or not completed.

I need to check which tr's have 5 td's with the data-name attribute set to completed.

If the row has 5 completed td's set, then that tr should be green.

HTML

<table id="workflowviz">
    <tr class="row">
        <td data-name="step1">0</td>
        <td data-name="stage: completed ">1</td>
        <td data-name="stage: completed ">2</td>
        <td data-name="stage: completed ">3</td>
        <td data-name="stage: completed ">4</td>
        <td data-name="stage: completed ">5</td>
    </tr>
    <tr class="row">
        <td data-name="step2">0</td>
        <td data-name="stage: completed">1</td>
        <td data-name="stage: not completed">2</td>
        <td data-name="stage: not completed">3</td>
        <td data-name="stage: not completed">4</td>
        <td data-name="Sub Stage: New ">5</td>
    </tr>
</table>

JS

I have written the code below for the first row based on the data-name attribute. But would like to avoid having to do this for each row within the jQuery loop.

$(document).ready(function(){
    step1 = ($("td[title |='step1']")
                .parents()
                .children("td[title |='stage: completed']").length);

    //alert("Num of step1= "+step1);

    if(step1 == 5 ) {  

        // alert("Step 1 Done");
        $("td[title |='step1']")
            .parents()
            .addClass("done_colorgreen");
    }
    else {}
});

解决方案

I have created a jsFfiddle for you using your code..

Code:-

$(document).ready(function() {
     $("table tr").each(function() {
         if ($(this).find("td[data-name='stage: completed ']").length == 5)
             $(this).addClass("green")
     })
 });

and its performance is also good..

working example:- http://jsfiddle.net/BtkCf/172/

to see the its performance see this link and open console see time taken by this code. http://jsfiddle.net/BtkCf/173/

thanks

这篇关于jQuery计数tr在td中有一些条件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！