Question

当src来自我的本地电脑时，如何禁用视频自动播放？

<iframe width="465" height="315" src="videos/example.mp4"></iframe>

我尝试过以下操作，但它不起作用：

src="videos/example.mp4?autoplay=0"
src="videos/example.mp4?autoplay=false"
src="videos/example.mp4?autostart=0"
src="videos/example.mp4?autostart=false"

Answer 1

如果您使用的是HTML5，则使用Video标记适用于此目的。

您可以通过这种方式使用视频标签进行无自动播放：

<video width="320" height="240" controls>
    <source src="videos/example.mp4" type="video/mp4">
</video>

要启用自动播放，

<video width="320" height="240" controls autoplay>
    <source src="videos/example.mp4" type="video/mp4">
</video>

Answer 2

您如何看待video代码？如果您不必使用iframe标记，则可以使用video标记。

<video width="500" height="345" src="hey.mp4"  />

您不应在autoplay标记中使用video属性来停用自动播放。

Answer 3

如果您仍然需要使用 iframe，请添加一个沙箱

<iframe width="465" height="315" src="videos/example.mp4" sandbox></iframe>

Answer 4

尝试使用此代码可禁用自动播放视频。

它正在工作。如果完成此操作，请投票

<div class="embed-responsive embed-responsive-16by9">
    <video controls="true" class="embed-responsive-item">
      <source src="example.mp4" type="video/mp4" />
    </video>
</div>

Answer 5

只需更换

<iframe width="465" height="315" src="videos/example.mp4"></iframe>

作者

<video src="videos/example.mp4" controls></video>

以下是使用引导程序4的示例：

 <div class="embed-responsive embed-responsive-4by3">
      <video src="videos/example.mp4" controls></video>
 </div>

Answer 6

插入嵌入式链接后使用"?rel=0"停止自动播放。此代码可以帮助您：

<iframe width="465" height="315" src="https://www.quirksmode.org/html5/videos/big_buck_bunny.mp4?rel=0"></iframe>

Answer 7

您可以在加载页面时将播放器的来源设置为空白字符串，这样您就不必切换到video标记。

var player = document.getElementById("video-player");
player.src = "";

如果您想播放视频，只需更改其src属性，例如：

function play(source){
   player.src = source;
}

Answer 8

我尝试了所有可能的解决方案，但是对于本地视频绑定没有任何作用。我相信最好的解决方案是，如果您仍然想使用iframe，则使用jQuery进行修复。

$(document).ready(function () {
    var ownVideos = $("iframe");
    $.each(ownVideos, function (i, video) {                
        var frameContent = $(video).contents().find('body').html();
        if (frameContent) {
            $(video).contents().find('body').html(frameContent.replace("autoplay", ""));
        }
    });
});

注意：它将在文档中找到所有准备就绪的iframe，并循环浏览每个iframe内容，并替换/删除autoplay属性。该解决方案可以在项目中的任何地方使用。如果您想对特定元素进行操作，请使用$.each函数下的代码，并将$(video)替换为iframe元素ID，例如$("#myIFrameId")。

Answer 9

为此替换iframe：

<video class="video-fluid z-depth-1" loop controls muted>
  <source src="videos/example.mp4" type="video/mp4" />
</video>

Answer 10

试试吧。

src="videos/example.mp4?autoplay=1"

Answer 11

您可以通过这种方式使用视频标签来不自动播放：

<iframe allowfullscreen="" frameborder="0" sandbox="" width="490 height="275" src=".../n1.mp4"></iframe>

Answer 12

<iframe width="420" height="315"
    src="https://www.youtube.com/embed/aNOgO7aNslo?rel=0">
</iframe>

您应该将字符?rel=0放在YouTube视频唯一链接之后和引用之前。它对我有用

如何在iframe中禁用本地视频的自动播放功能

12 个答案: