0

メインのhtmlファイルと、ユーザーがナビゲーターのボタンの1つをクリックした後にのみオンデマンドでロードされる外部htmlファイルに保存された多数のiframe要素があります。

$('#carousel_01').load('content_01.html');

各iframe の* src * 属性は、Vimeo ビデオを指しています。各 Vimeo ビデオに、ビデオの状態を監視し、メインの HTML ドキュメント (主に div アニメーション) 内で特定のアクションをトリガーするイベント リスナー関数をアタッチします。

問題は、外部 iframe がメインの html ファイルにロードされた後、ドキュメント自体の一部として登録されないことです。を使用して、メインの html ドキュメント内のすべての iframe を照会すると、 

var vimeoPlayers = document.querySelectorAll('iframe'), player;

以前にロードされた iframe のみが返されます。動的にロードされたものはリストにありません (メイン ページに表示され、表示されています)。ロードされた iframe をクエリできなければ、イベント リスナーをビデオにアタッチできません。インポートされた (ロードされた) iframe を認識できるように、メインの HTML ドキュメントの更新を強制するにはどうすればよいですか?

4

1 に答える 1

1

AJAX は非同期であるため、コールバック関数で変数を更新する必要があります。

$('#carousel_01').load('content_01.html', function() {
    vimeoPlayers = document.querySelectorAll('iframe');
});
于 2013-06-22T18:31:49.087 に答える