Javascript 在模式关闭时暂停本地视频

我在这里看到了一些类似问题的解决方案，但没有一个能满足我的需要。我有一个网页，将显示在一个信息亭，将不会有互联网连接，所以一切都是本地的。我所有的视频都是引导模式的，它们继续在模式关闭模式下播放

一种解决方案是完全删除链接，因此如果再次单击，视频将无法重播。其他各种形式的解决方案将视频停止1/2秒，然后视频继续

视频模式

    <!-- Modal Overview -->
  <div class="portfolio-modal modal fade" id="gal_overview" tabindex="-1" role="dialog" aria-hidden="true">
      <div class="modal-dialog">
        <div class="modal-content">
          <div class="close-modal" data-dismiss="modal">
            <div class="lr">
              <div class="rl"></div>
            </div>
          </div>
          <div class="container">
            <div class="row">
              <div class="col-lg-8 mx-auto">
                <div class="modal-body">
                  <!-- Project Details Go Here -->
                  <h2 class="text-uppercase">Overview</h2>
              <div class="embed-responsive embed-responsive-16by9">
                      <iframe class="embed-responsive-item" src="video/overview.mp4" allowfullscreen></iframe></div>
                      <button class="btn btn-primary" data-dismiss="modal" type="button">
                        <i class="fas fa-times"></i>
                        Close Video</button>
                    </div>
                  </div>
                </div>
            </div>
          </div>
      </div>
    </div>

概述
近距离视频

上次尝试的脚本

<script>
  $('.portfolio-modal').on('hide.bs.modal', function(e) {    
    var $if = $(e.delegateTarget).find('iframe');
    var src = $if.attr("src");
    $if.attr("src", '/empty.html');
    $if.attr("src", src);
  });
  </script>

$（'.portfolio modal'）.on（'hide.bs.modal'，函数（e）{
var$if=$（e.delegateTarget）.find（'iframe'）；
var src=$if.attr（“src”）；
$if.attr（“src”，'/empty.html'）；
$if.attr（“src”，src）；
});

---

当前代码将在页面加载时开始在后台播放所有视频。我肯定我错过了一些非常简单的东西。

有效答案：

由于iframe仅指向视频文件，因此可以将iframe更改为

，从而更轻松地控制视频

<video src="video/overview.mp4"></video>

初始答案：

听起来您应该懒洋洋地应用iframe的

src

属性。因此，当页面加载时，iframe的

src

属性应该是

datasrc

。这样就不会播放视频了

然后在

$（'.portfolio modal'）。在（'show.bs.modal'）

上，使用

数据src

的内容设置

src

属性。视频将播放

然后，当模式被隐藏时，再次将

src

替换为

/empty.html

下次启动模式时，将再次设置

src

，循环重复

---

如果你真的想暂停视频而不是重置iframe，那么应该会很有帮助。

$（'.modal body'）。on（'click.disease.bs.modal'，function（e）{var$If=$（e.delegateTarget）。find（'iframe'）；var reload=$If.attr（“src”）；$If.attr（“src”，“empty.html”）；$If.attr（“src”，“reload”）这就是我现在使用的。什么都没有。单击“关闭”按钮后，视频立即停止，然后开始在后台再次播放。您是否能够提供示例iframe
src
，以便我进行测试？我想知道目的地是否正在存储“播放”状态，并在重新加载iframe时将其还原。您是否要求我使用其中一个视频？某种程度上。我想我真正需要的是
src
上的页面。这不完全是一个视频-它是一个包含视频的页面。在这里，我们可以找到决定视频何时暂停和播放的逻辑。有两件事：1）视频与包含应用程序的域是否相同？2） 如果iFrame只指向
.mp4
视频，为什么不直接使用
元素，以便通过JavaScript API控制它们？
<script>
  $('.portfolio-modal').on('hide.bs.modal', function(e) {
    var $v = $(e.delegateTarget).find('video');
    $v[0].pause();  // use [0] because jQuery returns a list
  });
</script>