0

別のjJavascript関数を呼び出すために、テーブルにリスナーを追加しようとしています。

私のアプリは単純なアップロードスクリプトであり、ユーザーがアップロードするファイルを選択すると、テーブルに新しい行が作成されます。したがって、新しい行を作成するたびに、Javascript関数を呼び出したいと思います。

私のサンプルコードは次のとおりです。

$("#fayls").bind("DOMNodeInserted", function() {
    $(".chzn-select").chosen();
    alert('ha cambiato')
});

fayls私のテーブルのIDはどこにありますか。

このコードを実行すると、このイベントが1つではなく、無限に呼び出されます。

この問題をどのように解決すればよいですか？

ありがとう。

4

3 に答える 3

1

イベントは親ノード（バブル）にもディスパッチされるため、問題が発生します

W3Cから

DOMNodeInserted：-ノードが別のノードの子として追加されたときに発生します。-このイベントは、挿入が行われた後にディスパッチされます。
-このイベントのターゲットは、挿入されるノードです。-バブル：はい-キャンセル可能：いいえ-コンテキスト情報：relatedNodeは親ノードを保持します

行を追加するときにカスタムイベントをディスパッチし、コンボボックスを更新するためにバインドしてみてください

イベントの使用をバインドするには：

$('#something').bind('row.added', function(event) {
    event.stopPropagation();
    //your code here
}

イベントをトリガーするには（行が追加された後）、次を使用します。

$('#something').trigger('row.added');
于 2012-12-20T19:43:25.760 に答える
1

問題は、Chosen プラグインが、とりわけ、そのコンテナー内の要素を"#fayls"ID で変換することにあると思います。このことを考慮：

HTML:

<div id="something"></div>
<div id="completely_different"></div>
<button id="change_something" type="button">Change!</button>

JS:

$('#change_something').click(function() {
    $('#something').append($('<p>Internal P</p>'));
});
$('#something').bind("DOMNodeInserted", function(event) {
    alert(event.target);
    $("#completely_different").append($('<p>SOme p</p>'));
});

JSフィドル

期待どおりに機能します (ボタンをクリックするたびに、<p>要素が両方の div に追加されます)。

ここで、HTML を少し変更してみましょう。

<div id="something">
    <div id="completely_different"></div>
</div>
<button id="change_something" type="button">Change!</button>

JSフィドル

...そして今、イベントは無期限に発生します-内側の div を更新すると、DOMNodeInserted はまだ外側の div にバブルアップするためです。

また、DOMNodeInserted イベントは現在非推奨であると見なされていることにも注意してください (ただし、ここで説明されているように、IE9 ではまだサポートにバグがあります)。

于 2012-12-20T19:28:06.437 に答える
0

皆さんがおっしゃったように、問題は選択されたことが原因です。選択された各ドロップ ボックス項目に対して、DOM イベントが発生するため、無限ループが発生します。

不要なイベントをフィルタリングするだけで、簡単な解決策を見つけました。

 $("#listenMe").bind("DOMNodeInserted", function(event) {

        var targetName =  event.target.nodeName.toString() ;
        if (targetName == "TR") {
            $(".chzn-select").chosen();
            //alert('ha cambiato - Event Node Name:' + event.target.nodeName)
        }
    });

したがって、新しい行がテーブルに追加されたときにのみ実行されます

于 2012-12-24T13:36:23.663 に答える