1

じぶんの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は存在しますが、

4

1 に答える 1

0

YouTube APIをしばらく使ってみたところ、 と の両方で実行できるようになりChromeました。Safari

デモはhttp://plnkr.co/edit/07Cq5KqIa5Pase8JYHbA?p=previewです。

于 2013-06-26T04:04:04.443 に答える