Vimeo CallBack功能 - 视频结束时单击按钮

时间:2016-03-15 21:11:03

标签: jquery vimeo

我正在制作一堆视频。目前,用户必须单击"按钮"确保他们在转到下一个视频之前已经观看了视频。我想更改此功能,以便每当用户观看视频时按下"按钮"自动点击和下一次视频上传。单击按钮对于保存用户数据非常重要。

目前这是我实施的(测试代码):

<script src="https://f.vimeocdn.com/js/froogaloop2.min.js"></script>
<p style="text-align: center;"><iframe id="player1" src="https://player.vimeo.com/video/156873237?title=0" width="500" height="281" frameborder="0" allowfullscreen="allowfullscreen"></iframe></p>

<button type="button" onclick= "showMsg();">Click Me!</button>  
<script>
     function showMsg(){
           alert('you clicked');
     }
</script>

<script>
    var $ = jQuery.noConflict(); 
$(function() { 
    var iframe = $('#player1')[0];
    player = $f(iframe);
    player.addEvent('ready', function() {
    player.addEvent('finish', onFinish);
  });

 $('button').bind('click', function() {
      player.api($(this).onFinish());
   });

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

使用此功能,只要视频结束,它就不会给出任何响应。有什么我遗失或做错了什么。

1 个答案:

答案 0 :(得分:0)

根据他们的文档here,您应该在嵌入网址 api = 1&amp; player_id = player1 上添加更多参数,该参数启用API并指明playerId

<p style="text-align: center;"><iframe id="player1" src="https://player.vimeo.com/video/156873237?title=0&api=1&player_id=player1" width="500" height="281" frameborder="0" allowfullscreen="allowfullscreen"></iframe></p>

<button type="button" onclick= "showMsg();">Click Me!</button>


<script>
    function showMsg(){
        alert('you clicked');
    }

    $(function() { 
        var iframe = $('#player1')[0];
        player = $f(iframe);
        player.addEvent('ready', function() {       
            player.addEvent('finish', onFinish);
        });

     function onFinish(id) {
            alert('finished');
          }
     });
</script>

http://jsfiddle.net/vy9kf0w5/49/