如何使用JQuery停止Vimeo视频

Question

当我隐藏YouTube视频时,它会停止播放.但是,Vimeo视频不是这种情况.还有另一种方法可以阻止Vimeo视频吗？

Answer 1

首先,为您的iFrame添加ID.然后将其添加到您的javascript关闭窗口单击功能:

var $frame = $('iframe#yourIframeId');

// saves the current iframe source
var vidsrc = $frame.attr('src');

// sets the source to nothing, stopping the video
$frame.attr('src',''); 

// sets it back to the correct link so that it reloads immediately on the next window open
$frame.attr('src', vidsrc);

Answer 2

Vimeo有一个JavaScript API,允许您访问和调用视频播放器上的许多属性和方法(包括暂停视频并完全卸载它).他们还有一个API Playground和GitHub上的一些例子.

[编辑]

既然你提到你使用通用嵌入代码,这里有一些来自网站的警告:

使用Universal Embed Code,与播放器交互的唯一方法是使用window.postMessage.postMessage是一个相对较新的开发,因此它可以在以下浏览器中使用:Internet Explorer 8 +,Firefox 3 +,Safari 4 +,Chrome和Opera 9+.

由于postMessage涉及复杂性,我们编写了一个JS迷你库,为您完成所有艰苦的工作!您可以在下载页面上找到它,或者您可以在下面看到一些示例.

Answer 3

我最近需要在模式关闭时暂停位于 Bootstrap 模式内的 Vimeo 视频。

Vimeo 视频嵌入在 iframe 中。

这对我有用：

$("#my-bootstrap-modal").on('hidden.bs.modal', function (e) {
    var div = document.getElementById("my-bootstrap-modal");
    var iframe = div.getElementsByTagName("iframe")[0].contentWindow;
    iframe.postMessage('{"method":"pause"}', '*');
});

Answer 4

恢复SRC属性在清除之前使用以下内容:

var source = $('iframe#yourVideoId').attr('src');

下一个SRC属性清除:

$('iframe#yourVideoId').attr('src','');

回调之前的SRC属性:

$('iframe#yourVideoId').attr('src',source);