Video 如何在页面刷新时停止boostrap模式视频自动播放

我正在使用引导模式，当我使用URL时，这段代码运行良好。但是当我试图播放本地目录中的视频时。例如，当我使用

时，它不能正常工作。问题是每当页面刷新视频在单击“播放视频”按钮之前自动播放时。 我也尝试过使用HTML5视频标签，但问题是引导模式不起作用。还有

？rel=0

。我不想使用任何插件

$（文档）.ready（函数（）{
$（“.modal”）.modal（'hide'）；
var url=$（“#sampleVideo”）.attr（'src'）；
$（“.modal”）.on（'hide.bs.modal'，function（）{
$（“#sampleVideo”）.attr（'src'，”；
});
$（“.modal”）.on（'show.bs.modal'，function（）{
$（“#sampleVideo”）.attr（'src'，url）；
});
});
.trister{
背景尺寸：封面；
位置：相对位置；
}
.trister.modal对话框{
最大宽度：100%；
}
.挑逗者.情态{
右边填充：0！重要；
}
.挑逗者{
高度：100vh；
宽度：100%；
}
.挑逗者.情态体{
填充：0；
保证金：0；
}
.挑逗者，结束{
颜色：白色；
位置：绝对位置；
/*背景：蓝色！重要*/
边界：0；
排名：0；
z指数：99999；
右：3%；
浮动：无；
不透明度：1；
字体大小：40px；
字体大小：400；
}

&时代；接近
因为如果使用iframe插入本地视频，像Chrome这样的浏览器将创建如下元素：

<video controls autoplay name="media">
    <source src="assets/sample.mp4" type="video/mp4">
</video>

但您可能会遇到在文档准备就绪之前播放视频的问题。缓解此问题的一种方法是重置视频进度：

$(document).ready(function(){
    var elem = $("#sampleVideo").contents().find('video')[0];
    elem.autoplay = false;
    elem.pause();
    elem.currentTime = 0;
});

要重新打开模式，还可以为iframe onload添加事件处理程序：

$('#sampleVideo').on('load', function() {
    var elem = $("#sampleVideo").contents().find('video')[0];
    elem.autoplay = false;
    elem.pause();
    elem.currentTime = 0;
});

但我认为真正解决这个问题的方法是使用real
video
tag作为本地资源：

<div class="modal-body" id="yt-player">
    <video controls name="media">
        <source src="assets/sample.mp4" type="video/mp4">
    </video>
</div>

$(document).ready(function(){
    $(".modal").modal('hide');
    var url = $("#sampleVideo").attr('src');

    $(".modal").on('hide.bs.modal', function(){
        var elem = $("#sampleVideo")[0];
        elem.pause();
        elem.currentTime = 0;
    });

    $(".modal").on('show.bs.modal', function(){
        var elem = $("#sampleVideo")[0];
        elem.pause();
        elem.currentTime = 0;
    });
});


$（文档）.ready（函数（）{
$（“.modal”）.modal（'hide'）；
var url=$（“#sampleVideo”）.attr（'src'）；
$（“.modal”）.on（'hide.bs.modal'，function（）{
var elem=$（“#sampleVideo”）[0]；
元素暂停（）；
elem.currentTime=0；
});
$（“.modal”）.on（'show.bs.modal'，function（）{
var elem=$（“#sampleVideo”）[0]；
元素暂停（）；
elem.currentTime=0；
});
});

因为iframe的
src
中的url应该返回HTML。
谢谢。正如你说的，我试过你的代码。页面刷新问题已解决。但在模型关闭后，视频仍在继续播放。@Husna您可以尝试在iframe onload事件上添加视频处理。但我仍然建议您使用iframe src的html链接。我尝试了以下方式`$（“#sampleVideo”）.contents（）.find（'video'）.prop（“autoplay”，false）；`onLoad当我们使用
视频标记时
为什么在我使用iframe之前模态不工作我的js代码在模态关闭视频上工作正常停止播放。@Husna尝试使用视频API而不是修改DOM。为什么要从本地目录获取视频？如果站点在服务器上联机，则可以从URL中提取视频。那么本地目录视频有什么用呢？告诉我背后的确切原因。你的网站在线吗？请阅读我的问题一次，我想使用本地目录视频。我的网站不在线。
<div class="modal-body" id="yt-player">
    <video controls name="media">
        <source src="assets/sample.mp4" type="video/mp4">
    </video>
</div>

$(document).ready(function(){
    $(".modal").modal('hide');
    var url = $("#sampleVideo").attr('src');

    $(".modal").on('hide.bs.modal', function(){
        var elem = $("#sampleVideo")[0];
        elem.pause();
        elem.currentTime = 0;
    });

    $(".modal").on('show.bs.modal', function(){
        var elem = $("#sampleVideo")[0];
        elem.pause();
        elem.currentTime = 0;
    });
});