Javascript YoutubeAPI视频有时不';不要在IE 11中加载

Javascript YoutubeAPI视频有时不';不要在IE 11中加载,javascript,jquery,internet-explorer,youtube-api,Javascript,Jquery,Internet Explorer,Youtube Api,我制作了一个网站,从数据库中按id加载视频。我正在使用YoutubeAPI嵌入播放器,但IE播放器有时无法加载。这是剧本 <script> var player; var player_width = $(window).width() - 100; var player_height = $(window).height() - 50; $('.prev-next').height(player_height); $('.prev-next-but').height(playe

我制作了一个网站,从数据库中按id加载视频。我正在使用YoutubeAPI嵌入播放器,但IE播放器有时无法加载。这是剧本

<script>

var player;
var player_width = $(window).width() - 100;
var player_height = $(window).height() - 50;

$('.prev-next').height(player_height);
$('.prev-next-but').height(player_height);

function onYouTubePlayerAPIReady() {
    player = new YT.Player('player', {
        width: player_width,
        height: player_height,
      videoId: '<?php echo $yt_id; ?>',
      events: {
        'onReady': onPlayerReady,
        'onStateChange': onPlayerStateChange
      }
    });
}
function onPlayerReady(event) {
    event.target.playVideo();
}
function onPlayerStateChange(event) {        
    if(event.data === 0) {
        document.forms["not_skipped"].submit();
    }
}    

var播放器;
var player_width=$(窗口).width()-100;
var player_height=$(窗口).height()-50;
$('.prev next')。高度(玩家高度);
$('.prev next but')。高度(玩家高度);
函数onYouTubePlayerAPIReady(){
player=新的YT.player('player'{
宽度:播放器的宽度,
身高:球员的身高,
videoId:“”,
活动:{
“onReady”:onPlayerReady,
“onStateChange”:onPlayerStateChange
}
});
}
函数onPlayerReady(事件){
event.target.playVideo();
}
函数onPlayerStateChange(事件){
如果(event.data==0){
document.forms[“not_skipped”]。submit();
}
}    


当我使用simple iframe时,我没有这个问题,但我不知道如何在视频结束时以这种方式触发事件。

首先,检查加载播放器API库的方法。如果您使用的是脚本标记,那么脚本很可能在定义
onYouTubePlayerAPIReady
函数之前加载,因此不会触发任何内容。为了避免这种竞争情况,您希望按如下方式加载库:

<script>
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

var player;
var player_width = $(window).width() - 100;
var player_height = $(window).height() - 50;

$('.prev-next').height(player_height);
$('.prev-next-but').height(player_height);

function onYouTubePlayerAPIReady() {
    player = new YT.Player('player', {
        width: player_width,
        height: player_height,
      videoId: '<?php echo $yt_id; ?>',
      events: {
        'onReady': onPlayerReady,
        'onStateChange': onPlayerStateChange
      }
    });
}
function onPlayerReady(event) {
    event.target.playVideo();
}
function onPlayerStateChange(event) {        
    if(event.data === 0) {
        document.forms["not_skipped"].submit();
    }
}
</script>  
<iframe id="myplayer" width="560" height="315" src="//www.youtube.com/embed/0kl3VNy0uAI?enablejsapi=1" frameborder="0" allowfullscreen></iframe>    
<script>
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

var player;

function onYouTubePlayerAPIReady() {
    player = new YT.Player('myplayer', {
      events: {
        'onReady': onPlayerReady,
        'onStateChange': onPlayerStateChange
      }
    });
}
function onPlayerReady(event) {
    event.target.playVideo();
}
function onPlayerStateChange(event) {        
    if(event.data === 0) {
        document.forms["not_skipped"].submit();
    }
}
</script>

请注意,我们仍在动态加载玩家库,以避免竞争情况。

是。有时候,IE不起作用。严肃地说:“不加载”:你收到错误消息了吗?没有。播放器只是不出现。使用iframe,它在视频结束后仍然不会触发事件,也不会自动播放。但是它在IE上工作。哎哟——忘了提一下,当您有一个现有的iframe时,该iframe的源必须在源URL上包含enablejsapi参数(设置为1)。。。这允许您使用代码绑定到iframe事件。我已经编辑了上面的片段以反映这一点。谢谢,我稍后会尝试。