typescript 如何停止视频时关闭模态html5

7eumitmz  于 2023-05-08  发布在  TypeScript
关注(0)|答案(1)|浏览(106)

当我关闭模式时,视频仍在背景上播放。我试图解决它,但它不工作。我觉得我的剧本不真实但我不知道剧本有什么问题。

<script>
    function ShowData(value) {
        document.getElementById("linkVideo").setAttribute('src', value);
        $('#modalVideo').modal('show');
    }
    
</script>

我的视频身体

<div class="swiper-slide rounded container swiper-shadow" onclick="ShowData('my link video');">
                            <div class="item-heading">
                                <p class="text-truncate mb-0">
                                    2. my video
                                </p>
                                <br>
                                <br>
                                <br />
                                <p>
                                    <small>by</small>
                                    <small></small>
                                </p>
                            </div>
                            <div>
                                <img class="card-img-bottom" src="~/app-assets/images/elements/coverkioskM02.png" alt="Card image">
                            </div>
                        </div>

我的模式

<div class="modal fade" id="modalVideo" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered modal-dialog-centered modal-dialog-scrollable modal-xl" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalCenterTitle">Video</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close" Onclick="pauseVid()">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <center>
                    <video width="1280" height="720" controls autoplay  id="linkVideo" >
                    </video>
                </center>
            </div>
            <div class="modal-footer">

            </div>
        </div>
    </div>
</div>

谢谢你帮忙

szqfcxe2

szqfcxe21#

您可以在hide.bs.modal事件上停止视频。

$('#modalVideo').on('hide.bs.modal', function(e) {
    document.getElementById("linkVideo").pause();
});

相关问题