完成后重置 Vimeo 播放器

Question

How can I reset an embed Vimeo video to how it was onload after it's done playing?

The Vimeo API offers an unload method

player.api("unload")

But it isn't working for non-flash players.

Answer 1

Using the Vimeo API , you can add an event for finish to trigger the reload. The Vimeo API includes a method unload() , but it isn't supported in HTML players . Instead, reset the URL in the iframe to return the video to it's original state.

HTML

<iframe src="//player.vimeo.com/video/77984632?api=1" id="video"></iframe>

JS

var iframe = document.getElementById("video"),
    player = $f(iframe);

player.addEvent("ready", function() {        
    player.addEvent('finish', function() {
        player.element.src = player.element.src;
    });
});

Answer 2

unload()现在应该适用于所有玩家。

Answer 3

Variation of Steve Robbins solution, with Vimeo specific solution. You don't have to reach the end of the video, but anytime the user bails out, including clicking on a button:

function ResetVideo()
{ 
var Field  = "iframe-video";                   // <iframe id=iframe-video
var iframe = document.getElementById(Field);

var bLoad = LoadVimeoLib();                   // Is the Vimeo lib loaded
if(bLoad > 0)
  { 
  var Videoplayer   = new Vimeo.Player(iframe);
  Videoplayer.pause();                       // Pause the video and audio      
  Videoplayer.setCurrentTime(0);             // Reset the video position
    
  // Reset the video back to the iframe
  VideoSrc = Videoplayer.element.src;        // Save the video source
  Videoplayer.element.src = "";              // Empty the source
  Videoplayer.element.src = VideoSrc;        // Reset the video source
  }
}

function LoadVimeoLib()
{
if (typeof jQuery === 'undefined') 
 {
 alert('no jquery installed');
return 0;
}

var scriptlen = jQuery('script[src="https://player.vimeo.com/api/player.js"]').length;
if (scriptlen  == 0) 
  {
  jQuery.ajax({
    type: "GET",
    url: "https://player.vimeo.com/api/player.js",
    dataType: "script"
  });
  }

 return 1;
}