自定义行的jQuery添加事件不起作用

Question

I am trying to add click events only to the columns in a row that has some text in the first column. For the first row the click events should hide the rows that contain "1/" in the first column. Here is my html table:

<table class="results">
<tr>
<td>1</td>
<td>Distribution_Approval_Archive_WorkFLow</td>
<td>0h:2m:59s:845ms</td>
<td><font color="red">TestFail</font></td>
</tr>

<tr>
<td>1/1</td>
<td>MyLogin</td>
<td>0h:0m:8s:298ms</td>
<td><font color="green">TestCasePass</font></td>
</tr>

<tr>
<td>1/2</td>
<td>OpenEFlowEnterprise</td>
<td>0h:0m:13s:912ms</td>
<td><font color="green">TestCasePass</font></td>
</tr>

<tr>
<td>2</td>
<td>Distribution_Approval_Archive_WorkFLow</td>
<td>0h:2m:59s:845ms</td>
<td><font color="red">TestFail</font></td>
</tr>

<tr>
<td>2/1</td>
<td>MyVismaLogin</td>
<td>0h:0m:6s:223ms</td>
<td><font color="green">TestCasePass</font></td>
</tr>

<tr>
<td>2/2</td>
<td>OpenEFlowEnterprise</td>
<td>0h:0m:5s:158ms</td>
<td><font color="green">TestCasePass</font></td>
</tr>

</table>

And here is my jQuery for adding the events:

for (i=1; i <= $(".results td:nth-child(1):not(:contains('/'))").parent().length; i++){
    $($(".results td:nth-child(1):not(:contains('/'))").parent()[i-1]).children().click(function(){
        $('.results td:nth-child(1):contains("'+ i +'/")').parent().slideToggle("fast");
    })
}

Can you help fix the jQuery code?

Answer 1

Never bind events in loops,try the following

$('tr').find('td:first-child()').not(':contains("/")').parent().click(function(e){
   var index = $(this).find('td:first-child()').text().split('/')[0];
   $('td:contains("'+index+'/")').parent().slideToggle("fast");
});

Answer 2

You can code:

$(".results td:nth-child(1):not(:contains('/'))").on("click", function(){
      var i = $(this).text().split('/')[0];
      $('.results td:nth-child(1):contains("'+ i +'/")').parent().slideToggle("fast");
     });

Answer 3

Final code that I used for this ( http://jsfiddle.net/danginkgo/jr5qvqj3/ ):

$('.results tr td:first-child:not(:contains("/"))').parent().click(function(){
  var i = $.trim($(this).find('td:first-child').text().split('/')[0]);
  $('.results td:first-child:contains("'+ i +'/")').parent().slideToggle("fast");
});