非形式要素のjQuery変更イベント

Question

私はchangeイベントを探していますが、非フォーム要素を探しています。

問題：
私はtableですが、trのタグは別のスクリプトで動的に変化しています。 Trの要素がdisplay:blockからdisplay:noneに、またはその逆に変更されています。

そして、私はこのような何かが必要です（noneまたはblockを表示するためには関係しない）と、すべてのtr Sは以下のように設定されている場合は変更後のスクリプトがチェックする

イベントが私のtableのあらゆるtrの変更のためにリストされますがdisplay:noneそして真なら何かをしてください。

Answer 1

イベントがトリガーされないようなDOMの変更。あなたのオプションは、カスタムイベントを送信するためにDOMを変更するコードを更新するか、変更をポーリングすることです。最初のオプションは実装が最も簡単で、次のように表示されます。

// Add an event listener for change events 
$(document).bind("modified", function() { 
    alert("Someone modified " + this); 
}); 

// Modify a table and trigger an event for it 
$("#yourTable").css("display", "block").trigger("modified"); 

ポーリングオプションは遅くなり、推奨されません。最小の例：

setInterval(function() { 
    var $table = $("#yourTable"); 
    if ($table.css("display")!="block") { 
     alert("The table changed!"); 
    } 
}, 500); 

これは500ミリ秒ごとにテーブルをチェックします。

Answer 2

回避策として、タイマーを使用して定期的に内容が変更されているかどうか、またはすべてtr要素がdisplay:noneに設定されているかどうかをチェックできます。

Answer 3

1つの可能性は、これを行うタイマーを設定することです。たとえば、次のようになります。

jQuery(function($) { 

    var table = $("selector_for_your_table"); 
    var timerHandle = setInterval(function() { 
     if (table.find("tr:visible").length == 0) { 
      // No rows in the table are visible, do something 
     } 
    }, 500); 

}); 

0.5秒ごとに1回確認しますが、頻繁に行われる可能性があります。テーブルのサイズなどによって異なります。また、不必要な作業を避けることができる場合はいつでも、をからオフにすることもできます。 cancelInterval(timerHandle);を呼び出してキャンセルすることができます。

Answer 4

tr要素を隠したり表示したり、tr_was_hidden（）関数やtr_was_shown（）関数を呼び出すようなイベントを発生させる関数を作成します。この方法で、すべての表示/非表示イベントを処理することができます。

$.fn.showTR = function() { 
    return $(this).each(function() { 
     $(this).show(); 
     tr_was_shown(); 
    }); 
}; 

$.fn.hideTR = function() { 
    return $(this).each(function() { 
     $(this).hide(); 
     tr_was_hidden(); 
    }); 
};