Bootstrap 模态视频在关闭时继续播放

Question

我使用 MySQL 和 PHP 编写了一个视频索引程序，并将视频发送到模式窗口。但是，当模态窗口关闭时，视频会继续播放。这是代码。我是这方面的新手，提前道歉。我已经在互联网上搜索了没有任何解决方案的答案。

 <a href"#" class="video" data-video="<?php echo $vidpath . $file_mp4_v3;?>" data-toggle="modal" data-target="#videoModal"><?php echo $movie_name_v3 ;?></a>


  <div class="modal fade" id="videoModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="videoModalLabel">Modal</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body justify-content-center">
                    <div class="video" id="divVideo">
                        <video autoplay id="myVideo" width="1280" height="720" controls="false" poster="" class="myvideo img-fluid">
                                <source src="" type="video/mp4" />
                            <source src="" type="video/ogv" />
                            <source src="" type="video/wmv" />
                <script>
                     
                </script>
                        </video>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                </div>
            </div>
        </div>
    </div>
</div>

<script type="text/javascript">
$(function() {
  $(".video").click(function () {
    var theModal = $(this).data("target"),
        videoSRC = $(this).attr("data-video"),
        videoSRCauto = videoSRC + "";
    $(theModal + ' source').attr('src', videoSRCauto);
    $(theModal + ' video').load();
    $(theModal + ' button.close').click(function () {
      $(theModal + ' source').attr('src', videoSRC);
    });
  });

})


</script>
   

Answer 1

就像您将src 属性设置为开始播放视频一样，您可以将其清空以停止视频。

您可以使用the modal bootstrap events hide.bs.modal 或hidden.bs.modal 来执行此操作。

Answer 2

感谢您的回复，不胜感激。我已经尝试了上述 hide.bs.modal 或 hidden.bs.modal 函数的几种变体，但均未成功。我将把这个命令放在哪里以及如何正确编写脚本。 感谢您的帮助，不胜感激。