0

我目前正在使用 Youtube JavaScript API 将视频嵌入到我的网页中，以控制我拥有的播放列表。我似乎一遍又一遍的错误是视频本身在加载标题、播放图标和加载图标后立即变黑。视频似乎要播放一两秒钟。但是在标题向上滑动以允许视频播放后，我得到的只是黑色背景。标题与右上角的 youtube 文本一起显示得很好。但是视频本身没有播放。

从我所见，这个问题只发生在 iPhone 上。在 Android 和 PC 上完美运行。

    var playlistDescription = [];
    var playlist = [];
    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 youtubePlayer;
    function onYouTubeIframeAPIReady() {
        playlist.push("youtubevideoid");

        $(".video-list-item").each( function() {
            if ($(this).data("id") != "youtubevideoid") {
                playlist.push($(this).data("id"));
            }
        })

        youtubePlayer = new YT.Player("youtube-player", {
            videoId: "youtubevideoid",
            height: "378",
            width: "672",
            playerVars: {
                "color1": "#046a3b",
                "color2": "#faa820"
            },
            events: {
                "onReady": onPlayerReady,
                "onStateChange": onPlayerStateChange
            }
        });


    }  

    function onPlayerReady(event) {
        youtubePlayer.loadPlaylist(playlist);
    }

    function onPlayerStateChange(event) {
        if (event.data == -1 || event.data == 0) {
            var playlistDescriptionItem = playlistDescription[youtubePlayer.getPlaylistIndex()];
            $(".divSubHeadline").text(playlistDescriptionItem.title);
            $(".pageContent span").text(playlistDescriptionItem.description);
        }
    }

这是我用来加载 youtube 播放列表的脚本。播放列表变量包含视频连接到的播放列表项。

不能让它在 jsfiddle 上工作 - 可能只是我.. 所以我把脚本粘贴在这里。

4

2 回答 2

0

我有同样的问题。

我的问题似乎是我的 onPlayerReady 函数：

function onPlayerReady(event) {
    event.target.playVideo();
}

我删除后它工作得很好：

event.target.playVideo();

如果有兴趣，这是我的整个代码：

player = new YT.Player(playerId, {
  height: '410',
  width: '820',
  videoId: videoId,
  playerVars: {
      "autoplay": 1,
      "controls": 1,
      "showinfo": 0
  },
  events: {
      'onReady': onPlayerReady,
      'onStateChange': onIntroPlayerStateChange
  }
});

function onPlayerReady(event) {

}

function onPlayerStateChange(event) {
    if (event.data === 0) {
        console.log("Movie ended - go get some fresh air");
    }
}

自动播放，但似乎不适用于 IOS7 :-(

于 2013-10-17T13:40:44.633 回答
0

我有完全相同的问题。我在这里找到了答案：

https://groups.google.com/forum/#!searchin/youtube-api-gdata/ios $20autoplay/youtube-api-gdata/Fr39edfAKgs/FxfdHIu3H8MJ

“警告：为防止用户自费通过蜂窝网络进行未经请求的下载，嵌入式媒体无法在 iOS 上的 Safari 中自动播放 - 用户始终会启动播放。一旦启动播放，iPhone 或 iPod touch 上会自动提供控制器，但 iPad 除外您必须设置控件属性或使用 JavaScript 提供控制器。”

试试下面的代码：

youtubePlayer = new YT.Player("youtube-player", {
        videoId: "youtubevideoid",
        height: "378",
        width: "672",
        playerVars: {
            "autoplay": 1,
            "controls": 1,
            "showinfo": 0
        },
        events: {
            "onReady": onPlayerReady,
            "onStateChange": onPlayerStateChange
        }
    });


}  

function onPlayerReady(event) {
    // do whatever you need to do here
    // but don't call:
    // event.target.playVideo();
}
于 2013-08-12T07:41:49.750 回答