使用 jQuery 单击按钮时，如何暂停 YouTube 视频？

Posted 2023-05-09

【中文标题】使用 jQuery 单击按钮时，如何暂停 YouTube 视频？

【英文标题】：How can I pause a YouTube video when a button is clicked with jQuery?

【发布时间】：2012-01-27 11:10:48

【问题描述】：

我有一个 jQuery 滑块（大部分与 http://slidesjs.com 相同）。当按下“下一个”或“上一个”按钮同时更改幻灯片本身时，我没有找到有关如何暂停“当前”或可见幻灯片的 YouTube 视频的问题的答案。我也在使用 YouTube 的 iFrame，而不是旧的嵌入代码。

有没有办法用 iFrames 实现这个功能？我知道任何滑块 (http://css-tricks.com/anythingslider-jquery-plugin/) 拥有停止视频的能力，但我不确定它是如何实现的。

This 听起来会起作用，但我不确定如何将它与触发视频暂停功能的事件联系起来。

任何帮助将不胜感激。

【问题讨论】：

您需要将 youtube api 与anyslider 集成。 code.google.com/intl/tr-TR/apis/youtube/overview.html

@salt 我相信 YouTube API 已经内置于任何滑块中。但是，我试图在基于 slidesjs.com 滑块的滑块上单独执行此操作。我已经看过 API 页面了。

【参考方案1】：

您需要为您的播放器enable JS API。

之后，您可以使用player.pauseVideo() 暂停视频。

【参考方案2】：

$('iframe').each(function(i,e)
    let iframeSrc = $(e).attr('src');
    $(e).attr('src',iframeSrc);
);

这将为所有视频重置 src，您可以将其修改为仅定位一个

let iframeSrc = $('.youtube_video').attr('src');
$('.youtube_video').attr('src',iframeSrc);

将“.youtube_video”类替换为您的实际 iframe 类