次のコードを使用して、自分のサイトのyoutubeクリップ用にiframe_apiを実装しました。youtube.com/iframe_apiはIE11またはWindows 10のEdgeで起動しません
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
// Setup Youtube player
var player;
// Get id of first clip
var ytVideoId = jQuery('.start-yt').attr('data-video-id');
// When API is ready, create player with above id
function onYouTubePlayerAPIReady() {
player = new YT.Player('player', {
height: '390',
width: '640',
videoId: ytVideoId,
events: {
'onReady': onPlayerReady
}
});
console.log('API Ready');
}
// When player is ready
function onPlayerReady(event) {
jQuery('.start-yt').addClass('play-icon');
// Set glob var
var ytGlobId ="";
// Close button
jQuery('.ytClose').click(function(){
jQuery('.youtube-player-container').removeClass('active');
player.pauseVideo();
});
jQuery('.youtube-player-container').click(function(){
jQuery('.youtube-player-container').removeClass('active');
player.pauseVideo();
});
// load or play clip
jQuery('.start-yt').click(function(){
jQuery('.youtube-player-container').addClass('active');
if (ytGlobId == jQuery(this).attr('data-video-id')) {
player.playVideo();
} else {
ytGlobId = jQuery(this).attr('data-video-id');
player.loadVideoById(ytGlobId);
}
});
console.log('Player Ready');
}
この作品。しかし、友人はWindows 10とIE11 + Edgeを持っています。そして、それは'onReady': onPlayerReady
がそこで発火しないようです。 console.log
API Ready
を書きますが、確認した場合はPlayer Ready
ではありません。それはコンソールに何のエラーも与えません、それだけで発射しないと動作します。私はBrowserstackを同じ組み合わせ(Windows 10 + IE11/Edge)でチェックしていますが、動作するようです。
私はグーグルで回答を探しましたが、同様の問題を抱えている人もいますが、解決策を見つけるのに十分な例は見つかりませんでした。
ありがとう@abielita:
ここにも役立つかもしれない別のスレッドがあります。試してみたが、うまくいかなかった。 – JoakimB
私がする必要があるのは、console.logメッセージだけでそのイベントリスナーを呼び出すことです。 「https://www.youtube.com」の提供元が受信者のウィンドウの元(「https://www.youtube.com」)と一致していないため、「DOMWindow」の「postMessage」を実行できませんでした。 /dev3.axiell.com ')。 '、しかしプレーヤーは働いています。 Edge/IE11ではまだ違いはありませんが、それでも失敗します。私はイベントリスナー内に自分の機能を配置しようとしましたが、それはすべてのブラウザにプレーヤーをクラッシュさせました。 – JoakimB
同じことについて多くの分割されたコメントを残念に思っています。私が見ているように、問題は 'onReady()'関数がまったく呼び出されないということです。したがって、eventlistnerをその中に置くことは、Win10 + Edge/IE11で 'onReady()'が決して起動しないため、違いはありません。 – JoakimB