VideoJS视频不停止时关闭引导模式

Question

我有一个模态在我的网站，其中包含一个视频。当我点击模态时(点击模态外的背景，关闭按钮等)，模态关闭，但视频仍在后台运行。

我已经测试了我在stackoverflow上找到的所有解决方案，但似乎没有任何工作。

这是我的html(也许不是最好的代码):

$('.modal').on('hidden.bs.modal', function() {
$('video').each(function() {
this.player.pause();
});
})

<div class="modal fade" id="tutorialModal" tabindex="-1" role="dialog" aria-labelledby="tutorialModal" aria-hidden="true" style="z-index:99999;">
<div class="modal-dialog modal-dialog-centered modal-lg" role="document">
<div class="modal-content" style="-webkit-box-shadow: 4px 4px 14px -2px rgba(0,0,0,0.75); -moz-box-shadow: 4px 4px 14px -2px rgba(0,0,0,0.75); box-shadow: 4px 4px 14px -2px rgba(0,0,0,0.75); min-width:750px !important">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLongTitle"><img src="../images/logo.svg" height="60px"></h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<h4>Lorem ipsum!</h4>
<p>Lorem ipsum.</p>
<br>
<center>
<div style="width:500px;border-style:solid;border-color:#fafaf9">
<video id="highlightfilter" class="video-js vjs-fluid" controls preload="auto" width="555" height="300" poster="../videos/tutorial_thumbnail.png" data-setup='{}'>
<source src="../videos/tutorial.mp4" type="video/mp4">
</video>
</div>
</center>
<p>Some text... Text leads to a <a href="../link">link</a>.</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary btn-sm" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>

我找到了不同的脚本，主要是这样的(我把代码放在结束体标签之前):

$('.modal').on('hidden.bs.modal', function () {
$('video').each(function() {
this.player.pause();
});
})

但是什么都没用…你有什么主意吗?

非常感谢!

Hulotte

Answer 1

no needs ".player">

$('.modal').on('hidden.bs.modal', function () {
$('video').each(function() {
this.pause();
});
})