イベントの発生後に現在のiframeを選択

私はYoutubeビデオiframeを使用してブートストラップ3モーダルで作業しています。私は、モーダルはthis piece of js イベントの発生後に現在のiframeを選択

$('.music-modal').on('hidden.bs.modal', function() { 
    callPlayer('yt-music', 'stopVideo'); 
});

を使用して隠されたときにビデオを停止するには、簡単なJavaScriptの機能を実装し、これが唯一の1つのモーダルで1つのiframeとシームレスに連携します

<div class="youtube" data-embed="gjMBua_1J4Y" id="yt-music"> 
<iframe frameborder="0" allowfullscreen="" src="https://www.youtube.com/embed/gjMBua_1J4Y?rel=0&amp;controls=0&amp;showinfo=0&amp;autoplay=1&amp;enablejsapi=1"></iframe> 
</div>

のように埋め込まビデオが見えます。私が追加するすべてのビデオに対して新しいjs関数を実行する必要があります.Youtubeビデオにメッセージを送信するために使用しているcallPlayer関数はiframe IDだけをパラメータとして受け入れるためです。

モーダルイベントが表示されていないときに、現在再生中のビデオを停止します。それをキャプチャすることが可能ですが、idでそのモーダルのiframeを取得し、JSでビデオを停止するのですか？唯一の現在再生中のプレーヤーを停止します。

出典

2017-04-20 Pere

'callPlayer（$（this.find（）[0]、.ID 'stopVideo'） "ユーチューブは。";' – mplungjan

あなたは$（この）ラッピングを逃した;）が、魔法のように動作します！質問のみ： '（" .youtube "）[0]'は、youtubeクラスに一致する最初のIDだけが選択されていることを意味しますか？ – Pere

いいえ、ドームは$（this）.attr（ "I'd"）と同じですが、それはもっと明確です – mplungjan

これは

callPlayer($(this).find(".youtube").attr("id"), 'stopVideo');

出典

2017-04-20 15:21:16 mplungjan

は、YouTubeのAPIとplayersアレイを使用して、堅牢なソリューションで出会った作品。

jQuery(".modal").on('hidden.bs.modal', function() { 
$.each(players, function(k, v) { 
    if (this.getPlayerState() == YT.PlayerState.PLAYING) { 
     this.stopVideo(); 
    } 
}); 
});

出典

2017-04-25 08:19:38 Pere

イベントの発生後に現在のiframeを選択

答えて

関連する問題