javascript - 最初の 3 つの td と最後の td の個別のクリック イベントが Dom 変更で機能しない

Question

テーブルに4つの列があります。最初の 3 つの td のうちの 1 つをクリックすると 1 つの操作が実行され、最後の td をクリックすると他の種類の操作が実行されます。私はこれが好きでした

$('#items_list tr td').not('#items_list tr td:last-child').click(function() {
  // Do  something
}

$("#items_list tr td:last-child").click(function() {
  // Do something
}

しかし、Dom が変更されたときに機能しないもの。.live() を使ってみますが、li の欠点は Chaining メソッドがサポートされていないことです。誰でも私を導くことができますか？

Answer 1

テーブルのすべてのセルにイベントを追加する必要はありません。テーブル tbody レベルの 1 つのイベント ハンドラで処理できます。

jQuery("#foo tbody").on("click", function (evt) {
   var elem = jQuery( evt.srcElement || evt.target );
    if (elem.is("td:last-child")) {
        alert("last child");
    } else {
        alert("not last child");
    }       
});

td 内に要素がある場合は、最も近い td を探すために elem にコードを追加する必要がある場合があります。

if (!elem.is("td")) {
    elem = elem.closest("td");
}

jsフィドル

Answer 2

$("#items_list tr td").last().click(function(){ });