Question

我们正在使用Vimeo来托管公司培训视频，并且想知道在播放完成后是否有办法使用API来触发事件？！..我们正在尝试记录用户何时完全观看培训材料

欢迎任何建议。提前谢谢。

Answer 1

Vimeo播放器会触发许多不同的javascript事件。完成是这些事件之一。您可以在此处找到更多信息：https://developer.vimeo.com/player/js-api#events

Answer 2

我将其设置为我的服务器上的一个页面，它可以工作。一旦视频播放器通过3秒，你刚刚运行我的功能。出现在标签内。

我已经包含了整个页面代码 - 大多数javascript来自Vimeo API示例，您不需要它。

我遇到的一些事情 - 我无法在Jquery 1.10.X上运行 - 看起来这可能只适用于jquery 1.7.2。

另请注意，一旦显示元素，它就会一直显示 - 所以如果你希望它再次隐藏自己，如果这个人倒回玩家......你必须构建它，可能还有一个“else”语句

最后，我只在Chrome中对此进行了测试，因此请在投入使用前与您的本地Internet Exploder联系。

<html xmlns="http://www.w3.org/1999/xhtml">
<meta name="viewport" content="width = device-width, initial-scale = 1.0" />

<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="http://a.vimeocdn.com/js/froogaloop2.min.js"></script>
</head>
<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>

<p>Video status: <span class="status">...</span></p>
<p><button>Play</button> <button>Pause</button></p>
<h3 id="show"></h3><!-- thats where the message will show -->
<script>
jQuery(document).ready(function($) { // WordPress needs jquery like this...
var iframe = $('#player1')[0],
    player = $f(iframe),
    status = $('.status');

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

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

// Call the API when a button is pressed
$('button').bind('click', function() {
    player.api($(this).text().toLowerCase());
});

function onPause(id) {
    status.text('paused');

}

function onFinish(id) {
    status.text('finished');
}

function onPlayProgress(data, id) {
    status.text(data.seconds + 's played');
    var time = data.seconds; //I added this var and the little if below...that's it.
    if (time > 3) {
    show.innerHTML = "You just made my function run."; }
}
// add an appropriate event listener


});
</script>
</html>

Answer 3

我正在使用Vimoe player.js

<script src="https://player.vimeo.com/api/player.js"></script>

及以下是我也已集成到网站上的代码，以了解有多少登录用户观看完整视频。

player.on('ended', function(){ 
   // Video Finished 
    // ajax call for custom event in WordPress
    $.ajax({
            url : '<?php echo admin_url("admin-ajax.php" ) ?>',
            data : {
                action: "create_update_user",
                user_id : "<?php echo $user->ID; ?>",
                post_id : "<?php echo get_the_ID(); ?>",
                status : 'complete' },
            dataType : "post",
            type: "post",
            success: function(response){
            }
     });

希望它有用，因为player.js更有用而不是froogaloop2.min.js

谢谢

Vimeo API触发事件

3 个答案: