Vimeo Player附加事件 - 結束

我的頁面中有多個iFrame。我想附上「玩」和「結束」事件的事件。「玩」事件被激發，但「結束」事件不會觸發。下面是我用來附加事件的代碼。Vimeo Player附加事件 - 結束

<!DOCTYPE html> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
</head> 
<body> 
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
    <script src="https://player.vimeo.com/api/player.js"></script> 
    <form id="form1" runat="server"> 
     <div> 
      <iframe id="player1" src="https://player.vimeo.com/video/76979871?api=1&player_id=player1" width="640" height="360" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe> 
      <iframe width="560" height="315" src="//player.vimeo.com/video/5705212?api=1&player_id=video1" id="video1"></iframe> 
     </div> 
    </form> 
    <script> 

     $(document).ready(function() { 
      var x = document.querySelectorAll("iframe"); 
      var nodelist = x.length; 
      alert(nodelist); 

      for (i = 0; i < nodelist; i++) { 

       var player = new Vimeo.Player(x[i]); 

       player.on('play', function() { 
        console.log('played the video!'); 
       }); 

       player.on('ended', function() { 
        console.log('ended the video!'); 
       }); 
      } 
     }); 

    </script> 
</body> 
</html>

來源

2017-06-15 sujit kumar

要在視頻完成後觸發事件，您應該使用player.onfinish（） - 請參閱下面的代碼以獲取更多信息。

<!DOCTYPE html> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
</head> 
<body> 
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
    <script src="https://player.vimeo.com/api/player.js"></script> 
    <form id="form1" runat="server"> 
     <div> 
      <%--<iframe id="player1" src="https://player.vimeo.com/video/76979871?api=1&player_id=player1" width="640" height="360" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>--%> 
      <iframe id="player1" src="https://player.vimeo.com/video/76979871?api=1" width="640" height="360" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe> 
      <%--<iframe width="560" height="315" src="//player.vimeo.com/video/5705212?api=1&player_id=video1" id="video1"></iframe>--%> 
      <iframe width="560" height="315" src="//player.vimeo.com/video/5705212?api=1" id="video1"></iframe> 
     </div> 

     <script> 

      $(document).ready(function() { 
       var x = document.querySelectorAll("iframe"); 
       var nodelist = x.length; 
       alert(nodelist); 

       for (i = 0; i < nodelist; i++) { 

        var player = new Vimeo.Player(x[i]); 

        player.on('play', function() { 
         console.log('played the video!'); 
        }); 

        player.on('ended', function() { 
         console.log('ended the video!'); 
        }); 

        player.on('finish', function() { 
         console.log('finished the video!'); 
         player.getDuration().then(function (duration) { 
          // duration = the duration of the video in seconds 
          console.log('video length is:', duration); 
         }).catch(function (error) { 
          // an error occurred 
         }); 
        }); 

        player.on('playProgress', function() { 
         console.log('Video in progress!'); 
        }); 

        //player.getVideoTitle().then(function (title) { 
        // console.log('title:', title); 
        //}); 
       } 
      }); 

     </script>

來源

2017-06-16 09:40:07

Vimeo Player附加事件 - 結束

回答

相關問題