Question

我试图通过动态添加来自froogaloop的一个或多个vimeo玩家捕捉暂停和播放事件。

玩家最初是隐藏的，但我仍然希望将事件附加到玩家。

我做了一个js小提琴，说明了我的问题。当mydiv有style：display：none时，事件就绪并不会触发。

http://jsfiddle.net/jonasvermeulen/c3dqU/2/

这是我的HTML：

<div id="mydiv" style="display:none"></div>

这是我的jquery

$('#mydiv').append('<iframe id="player1" src="http://player.vimeo.com/video/27855315?api=1&player_id=player1" width="400" height="225" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>');
var iframe = $('#player1')[0];
var player = $f(iframe);

// When the player is ready, add listeners for pause, finish, and playProgress
player.addEvent('ready', function() {
   alert("ready");

    player.addEvent('pause', onPause);
    player.addEvent('finish', onFinish);
    player.addEvent('playProgress', onPlayProgress);
});

function onPause(id) {
    alert('paused');
}

function onFinish(id) {
    alert('finished');
}

function onPlayProgress(data, id) {
    alert(data.seconds + 's played');
}

删除显示时：无效。

有解决方法吗？

Answer 1

display:none的元素表现得好像它们在很多方面都不是DOM的一部分。

（只需尝试使用另一种隐藏元素的方法 - visibility，绝对定位在屏幕外，...）

...或者，如你所说，当玩家不再被隐藏时绑定事件。

隐藏的视频vimeo上的froogaloop事件

1 个答案: