onStateChange不会触发第二次

似乎有很多围绕onStateChange事件的讨论没有解雇，但我似乎无法找到答案我的具体问题。就我而言，我可以很好地与API连接并加载视频。 API就绪事件触发，然后是onPlayerReady，然后是onStateChange。当我更接近观看者（嵌入了视频的iFrame）并再次打开它时，API就绪事件触发，然后是onPlayerReady，但onStateChange在视频开始播放时不会触发...onStateChange不会触发第二次

我有刷新浏览器并重新加载脚本以使相同或不同的视频工作，这在我的情况下显然不是可接受的解决方案。

我也尝试手动添加侦听器，但不幸的是我有相反的问题，因为多个事件然后被解雇，因为没有办法在关闭查看器时删除该侦听器。

我还要补充一点的行为是在Chrome和Firefox一样的（最新版本）

你在这个问题上的帮助将是非常赞赏。

感谢，

来源

2013-08-18 user2694731

目前尚不清楚“关闭观察者”的含义。你在设置“display：none”吗？我们可以尝试一个实际的例子来证明你的问题。 –

这是一个基本上嵌入指定视频的自定义查看器。只需一个DIV标签中的iFrame。本质上，DIV设置为“display：none”。我的代码全部集成在Web应用程序中，整个功能很难提取。 – user2694731

Internet Explorer和Firefox上的[youtube iFrame API]可能的重复（http://stackoverflow.com/questions/14147677/youtube-iframe-api-on-internet-explorer-and-firefox） –

好了，所以我挖成码多一点，并将其最小化到确切的问题。这是iFrame设置url调用的问题。杰夫，我修改上的jsfiddle（http://jsfiddle.net/jeffposnick/yhWsG/3/）的例子如下：

HTML代码：

<div id="DIVTAG"> 
     <iframe class="gwt-Frame" id="player" width="640" height="360" src="https://www.youtube.com/embed/M7lc1UVf-VE?wmode=transparent&amp;enablejsapi=1&amp;modestbranding=1&amp;rel=0&amp;showinfo=0&amp;fs=0;autoplay=1"></iframe> 

    </div> 

<button onclick="hide()">Hide Player</button> 
<button onclick="show()">Show Player</button>

JavaScript代码：

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 onYouTubeIframeAPIReady() { 
    player = new YT.Player('player', { 
     height: '390', 
     width: '640', 
     events: { 
      'onReady': onReady, 
      'onStateChange': onPlayerStateChange 
     } 
    }); 
} 

function onReady() { 
    alert("player ready"); 
} 

// The API will call this function when the video player state changes. 
function onPlayerStateChange(event) { 
    alert("player state changed"); 
} 

function hide() { 
    player.stopVideo(); 
    document.getElementById("player").style.display="none"; 
} 

function show() { 
    document.getElementById("player").style.display="block";  
document.getElementById("player").src="https://www.youtube.com/embed/M7lc1UVf-VE?wmode=transparent&amp;enablejsapi=1&amp;modestbranding=1&amp;rel=0&amp;showinfo=0&amp;fs=0;autoplay=1"; 

}

您可以选择忽略的“hide播放器“按钮，只要点击”播放器“，视频加载后，你会看到一旦播放器第二次加载，stateChange事件将不会触发。

我只是设置onReady事件触发两次，但onStateChange不是的iframe的来源。希望这有助于提出修复建议。

来源

2013-09-03 04:49:59 user2694731

这不是您如何将新视频加载到现有播放器中。您应该致电player.loadVideoById('VIDEOID')而不是尝试更改现有iframe的src属性。

如上所述，请不要隐藏玩家设置display: none。如果需要，您可以将播放器移出屏幕（负x/y位置）。

来源

2013-09-06 01:11:02

因此，如果我正确理解这一点，我应该首次在URL中设置视频ID来源？然后使用loadByVideoID方法？当我尝试时，旧的视频再次加载。 – user2694731

如果你使用'YT.Player' API（你是），那么你永远不需要明确地创建一个'iframe'或者设置它的'src'。 'YT.Player'会从'videoId'参数中选出你应该传入构造函数的初始视频ID，然后调用'loadVideoById（）'将把一个新视频加载到现有的播放器中。请参阅https://developers.google.com/youtube/iframe_api_reference –

onStateChange不会触发第二次

回答

相关问题