jquery - div 作成のテスト

Question

私は drupal を使用しており、チャットごとに div を作成するチャット モジュールを使用しています。外部モジュールなので、コードを変更したくありません。私の質問はこれです：

別のスクリプトがdivを作成した場合、jqueryがイベントをトリガーする方法はありますか? X秒ごとにテストする必要がありますか？

Answer 1

多分このようなもの：

$('#myDiv').bind('DOMNodeInserted DOMNodeRemoved', function(event) {
    if (event.type == 'DOMNodeInserted') {
        alert('Content added! Current content:' + '\n\n' + this.innerHTML);
    } else {
        alert('Content removed! Current content:' + '\n\n' + this.innerHTML);
    }
});

これにより、特定の div に何かが追加されたかどうかを確認できます。そのため、myDiv に何かが挿入されている場合、リッスンするイベントがトリガーされ、特定のアクションが実行されます。

Answer 2

これが、新しいミューテーション イベント仕様の目的です。まだ初期段階ですが、サポートするブラウザによっては使えるかもしれません。

機能検出: JavaScript での突然変異イベントの可用性?

Answer 3

クライアントのブラウザがそれをサポートしている場合は、次のフィドルのようにすることができます:

</div>
    <input type="button" onclick="javascript: create_div();" value="create"/>
    <div id="div-area"></div>​
    <script>
    function create_div() {
        $('#div-area').append('<div class="chatdiv">new chat</div>');
    }
    $(document).ready(function() {
        $('#div-area').bind('DOMNodeInserted', function(e, o) {
            $(e.target).css('background', 'red');
        });
    });
    </script>
</div>

あなたのコメントによると、onclickに登録する必要があります。これは何のためのものlive()です：

</div>
    <input type="button" onclick="javascript: create_div();" value="create"/>
    <div id="div-area"></div>​
    <script>
    function create_div() {
        $('#div-area').append('<div class="chatdiv">new chat</div>');
    }
    $(document).ready(function() {
        $('#div-area div.chatdiv').live('click', function(e, o) {
            $(e.target).css('background', 'red');
        });
    });
    </script>
</div>

jsfiddle .