如何使用 JavaScript 暂停 HTML5 视频？ [复制]

Posted 2023-05-07

【中文标题】如何使用 JavaScript 暂停 HTML5 视频？ [复制]

【英文标题】：How do I pause a HTML5 video with JavaScript? [duplicate]

【发布时间】：2013-04-18 03:16:11

【问题描述】：

最初视频是隐藏的。当您单击 ID 为 3 的图像时，可以看到视频。我放了一个 ID 为 close_video 的按钮，它将隐藏播放器。问题是单击按钮后它仍在运行视频。如何暂停视频？

代码是：

<div id="video" class="popup-video">
  <div class="video">
    <div class="close_video" id="close_video">
    </div>
    <video id="id_video"   controls="controls" preload="auto">
      <source src="$content_dirthemes/trendy/video/Wildlife.mp4" type="video/mp4"/>     
    </video>                         
  </div>
</div>  

<script>
  $(document).ready(function()
    $('#3').click(function()
      $("#video").removeClass("popup-video").addClass("popup-video-show");
    );
  );
</script>
<script>
  $(document).ready(function()
    $('#close_video').click(function()
      $("#video").removeClass("popup-video-show").addClass("popup-video");
    );
  );
</script>

我也试过这个：

<script>
  $(document).ready(function()
    $('#close_video').click(function()
      $("#video").removeClass("popup-video-show").addClass("popup-video");
      document.getElementById('id_video').pause();
      // and $("#id_video").pause();
    );
  );
</script>

仍然没有效果。视频消失了，但仍在播放。

【问题讨论】：

我刚刚搜索了您的标题并找到了以下主题：***.com/questions/4155329/…

你可以使用：$("#id_video").gt(0).pause();

【参考方案1】：

使用 jQuery 时，您需要先使用 'get'：

$('#videoId').get(0).pause()

【讨论】：

尝试过 $('#videoId').get(0).pause()，但 firefox 中的错误是：TypeError: $(...).get(...).pause不是函数

你运行的是什么版本的 Firefox？

最新版本 20.0.1 firefox

TypeError: $(...).get(...).pause 不是函数

@marius 你添加了jQuery Script吗？

【参考方案2】：

通常您只需点击视频即可暂停/播放。

不要使用pause()，而是尝试使用click()

【讨论】：

我使用了 click() 但没有任何效果

【参考方案3】：

使用 html5 时，请使用：

document.getElementById(\"movie_player\").click()

它对我有用。