2

問題はDOMを操作することでより根本的なものだと思いますが、確認する方法がわかりません。

そのため、動的にタブを作成し、別の静的タブ div の HTML を使用して、対応する div HTML を追加しました。これはうまく機能します。

    $('#specific-tab').html($(this).closest('div').html() ); 
//where this is always one line away from closest('div') to copy from, promise.

その後、すべてのタブ内のすべての入力テキスト ボックスを通過する各ステートメントが 1 つあります。

$('#div-above-tabs input[data-item=specialvalue]').each(function() {
   $(this).change(function() {
    //do stuff
   });
});

このステートメントは、動的に作成されたタブを除くすべてのタブで完全に機能します。

参照されているすべての属性、ID、クラスを確認するのに 8 時間費やしましたが、それらは完全で一意に識別されています。

私が知らないこれらのメソッドを使用した DOM の動作はありますか?

編集

最初のスニペットは、change() トリガーで発生します。2 つ目は、トリガーなしで発生しますが、コードのかなり後で記述されます。関連する？

4

3 に答える 3

1

問題は

$('#div-above-tabs input[data-item=specialvalue]').each(function() {
   $(this).change(function() {
    //do stuff
   });
});

そのはず

$('#div-above-tabs').on('change', 'input[data-item=specialvalue]', function() {
    //do stuff
});

動的に作成される要素がありますが、dom ready でイベントハンドラーをdiv-above-tabs登録しているためです。change

この場合、上記のようにイベント伝播を使用して委任されたイベント処理を使用する必要があります

于 2013-06-09T02:25:35.123 に答える
0

これは単なる推測ですが、タブを生成する前に .each 関数が DOM を分析していると思います。変更を後でそれぞれを検索するのではなく、タブ コンテナー全体の内容に基づいて、入力自体にリスナーを設定することをお勧めします。繰り返しになりますが、情報が限られているため、これは単なる推測にすぎません...このステートメントは、メインタブコンテナーの変更を監視し、DOM ロード後に作成された入力の変更もキャッチする必要があります...

$("#above_tabs_container").on("change","input[data-item=specialvalue]",function() {
   // do some function stuff
});

試してみる価値があるかもしれません。私は動的にロードされる大量のものに $.on を使用しています。ロード時に DOM にあるコンテナを見ている限り、それをキャッチしているようです... http://api.jquery.com /の上/

于 2013-06-09T02:26:03.993 に答える
0

トム・ピエトロサンティのコメントは正しかった。ここでは実行順序が問題でした。最初のスニペットの change() は、残りのスニペットが既にロードされるまで実行されなかったので、2 番目の each() です。

私は .on() を使用していたでしょう-素晴らしい解決策ですが、1.7以降は選択できません。理由は聞かないでください。

私がしなければならなかったのは、便利な近くに配置されたクリック イベントに each を追加することだけでした。

これは、サーバー側の言語から来た人として覚えておくのが難しい概念です -コードの順序は実行の順序と必ずしも同じではありません

jsfiddle の皆さん、次回は申し訳ありません。:)

みんなの時間をどうもありがとう、たくさんの良い答え!

于 2013-06-09T02:45:05.257 に答える