jQuery：テーブルに行が残っていないかどうかを検出する

Question

テーブルに行が残っているかどうかを検出しようとしていますが、存在しない場合はアラートを表示します。次のコードは動作していないようですが、どのようなアイデアですか？ Iアラート前に削除してみました、そしてそれは私が行を削除するたびにトリガ：

$('.remove_row').live('click', function() { 

    //If there are no rows left in table, display alert 
    if ($(this).parent().parent().parent().children('tr:eq(1)').length == 0) { 

     alert("no rows left"); 

    } 

    $(this).parent().parent().remove(); 

}); 

EDIT（Iインデックス1を用いる理由でテーブルヘッダを左に1行があります）。

---

EDITはAGAIN：最後の1が実際にDOMから削除される前にチェックされているので、インデックス2を作るために必要な、それを手に入れました。

Answer 1

if ($(this).closest("tbody").find("tr").length === 0) { 
    alert("no rows left"); 
} 

これは、クリックされた要素のcloest親tbodyを（tbodyは常にDOMに存在する）を求めます。前記tbody内のtr要素の長さをチェックします。値が0の場合、アラートが表示されます。代わりに.live()を使用しての

Answer 2

、（あなたが1.7よりも古いのjQueryを使用している場合、または.delegate()）.on()を使用します。ここでは

//bind to the `click` event for all `.remove_row` elements that are in the DOM or will be in the future that have the ancestor `#table-id` element 
$('#table-id').on('click', '.remove_row', function() { 

    var $TRs = $(this).parents('table:first').find('tr'); 

    //find the number of rows in the table in which the clicked `.remove_row` element is located 
    if ($TRs.length < 2) { 

     alert("no rows left"); 

    } else { 

     $TRs.eq(0).fadeOut(500, function() { 

      $(this).remove(); 

     }); 

    } 

}); 

はデモです：イベントが結合.delegate()を使用しhttp://jsfiddle.net/UbUbM/

は次のようになります。これは：

$('#table-id').delegate('.remove_row', 'click', function() { 

これは、テーブルをルート要素として使用します。 document要素よりもこれはまた、このコードが実行されるときにテーブルがDOM内にあることを前提としています。

屋のためのいくつかのドキュメント：

• .on()：http://api.jquery.com/on
• .delegate()：http://api.jquery.com/delegate
• .live()：http://api.jquery.com/liveは