2

同じページに複数のテーブルがあり、以下のように各テーブルのラインショーカウントを追加したいと思います。何かを試しましたが、すべてのテーブル行の数の合計が表示されます。

<table>
 <tr>
   <td>Some data</td>
   <td>More data</td>
 </tr>
 <tr>
   <td>Some data</td>
   <td>More data</td>
 </tr>
</table>

<table>
 <tr>
   <td>Some data</td>
   <td>More data</td>
 </tr>
 <tr>
   <td>Some data</td>
   <td>More data</td>
 </tr>
</table>

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
 $().ready(function(){

  //I want to add a line after each table showing each table row count
  $("table").after(??? + " rows found.");
 });
</script>
4

5 に答える 5

4
$("table").each(function(){
    $(this).after($(this).find('tr').length + " rows found.");    
})

ワーキングフィドル

于 2012-09-22T09:19:14.587 に答える
3

次のように、行数を非常に簡単に取得できます。

// loop over all tables
$("table").each(function(){ 
    // get number of rows, uses jQuery's context parameters to speed things up
    // (it is apparently somewhat faster than using 'find' in most cases)
    var nrOfRows = $("tr", this).length;

    $(this).after(nrOfRows + " rows found");
});

ワーキングデモ

更新もちろん、より少ない行でそれを行うことができます、私はコメントを使用してそれをより明確にするためにそれを分割します。あなたはただ書くことができます:

$("table").each(function(){ 
    $(this).after($("tr", this).length + " rows found");
});
于 2012-09-22T09:20:33.343 に答える
3

これはどうですか?

$("table").each(function(){
    $(this).after($(this).find('tr').length + " rows found.")
});

編集

最後のテーブルの後の両方のテーブルから合計を取得するには:

$('table:last').after($('tr').length + " rows found.")
于 2012-09-22T09:20:43.427 に答える
3

必要に応じて、.each()ループなしで、のみを使用しafter()ます。

$("table").after(function(){
    return $('tr', this).length + " rows found.";    
});

デモ

于 2012-09-22T09:43:41.080 に答える
1

私は提案します:

​$('table tbody').each(
    function(){
        var tfoot = $('<tfoot />', {'class' : 'rowSummary'}).insertBefore($(this)),
            tr = $('<tr />').appendTo(tfoot),
            len = $(this).find('tr').length,
            cell = $('<td />',{'colspan' : '2' }).text(len).appendTo(tr);
    });​​​​​​​​​​​​​

JSフィドルデモ

于 2012-09-22T09:21:51.763 に答える