Question

我的网页首先有一个空div，点击按钮时会打开一个YouTube视频。

HTML：

<script src="public/js/yt-player.js" async="true"></script>
<div class="bgCover">&nbsp;</div>
    <div class="overlayBox">
        <div class="overlayContent">
            <div class="player"></div>
        </div>
    </div>

JS（在外部文件中）：

$(document).ready(function() {

var isOpen = false;

// 2. This code loads the IFrame Player API code asynchronously.
var tag = document.createElement('script');

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


// 3. This function creates an <iframe> (and YouTube player)
//    after the API code downloads.
var player;


window.onYouTubeIframeAPIReady = function() {
    player = new YT.Player('player', {
        height: '480',
        width: '800',
        videoId: '8hP9D6kZseM',
        events: {
            'onReady': onPlayerReady
        }

    });
}

function onPlayerReady() {
    // Never get here
    console.log(player);
}


function stopVideo() {
    player.stopVideo();
    player.clearVideo();
}

function doOverlayOpen() {
    // ...
    player.playVideo();
}

function doOverlayClose() {
    // ...
    player.stopVideo();
}

$('a.launchLink').click(doOverlayOpen);

在“测试”环境中尝试代码时（只需按钮，测试：http://jsfiddle.net/Te74S/），它的效果非常好。

但是在生产环境中我加载了很多js文件，似乎从未调用onPlayerReady函数。

所以我收到关于playVideo和stopVideo函数的错误，例如“Uncaught TypeError：undefined is not function”。对问题来自哪里有任何想法？

由于

Answer 1

<div class="player"></div>

应该是

<div id="player"></div>

玩家的目标是身份而不是班级。

Youtube iframe Api没有加载视频

1 个答案: