我的HTML
<div id="player">
<!-- hardcoded for the moment -->
<div id="video">
<iframe class="youtube-player" id="video-frame" width="640" height="390" src="http://www.youtube.com/v/gSy4HeDjPvs?version=2&enablejsapi=1" frameborder="0" allowfullscreen></iframe>
</div>
</div>
JavaScript
var youtube_player; // global player variable
// adding YouTube controls
$(function () {
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
});
function onYouTubeIframeAPIReady() {
//noinspection JSUnresolvedFunction,JSUnresolvedVariable
youtube_player = new YT.Player('video', {
height:'390',
width:'640',
videoId:'JW5meKfy3fY',
events:{
'onReady':onPlayerReady,
'onStateChange':onPlayerStateChange
}
});
}
// playing video in left pane
function play_video(id) {
console.log('play video', id);
//noinspection JSUnresolvedFunction
if (youtube_player) {
youtube_player.loadVideoById(id, 0);
}
}
function onPlayerReady(evt) {
evt.target.playVideo();
}
// when video is finished playing, what next video to play?
function onPlayerStateChange(event) {
if (event.data == 0) {
var id = get_next_video_id();
if (id == -1) {
// repeat = 0, reset video_index
reset_video_index();
} else {
play_video(id);
}
}
}
这在Safari中运行良好，但在Chrome中失败。在console.log上，它说
Uncaught TypeError: Object #<U> has no method 'loadVideoById' vlists.js:447
30
Unable to post message to http://www.youtube.com. Recipient has origin https://www.youtube.com.
即使在YouTube API中，loadVideoById也存在。