禁用 html5 视频自动播放

Answer 1

我会删除

autoplay

属性，因为如果浏览器遇到它，它会自动播放！

autoplay

是一个 HTML 布尔属性，但请注意，不允许使用值

true

和

false

。要表示

false

值，您必须省略该属性。

布尔属性不允许使用“true”和“false”值。要表示假值，必须完全省略该属性。

此外，类型位于源代码内部，如下所示：

<video width="640" height="480" controls preload="none">
   <source src="http://example.com/mytestfile.mp4" type="video/mp4">
   Your browser does not support the video tag.
</video>

---

参考资料：

• http://www.w3.org/TR/html-markup/video.html
• HTML 规范（布尔属性）

Answer 2

删除视频标签中的自动播放。使用这样的代码

<video class="embed-responsive-item"  controls>
   <source src="http://example.com/video.mp4">
   Your browser does not support the video tag.
</video>

100% 正常工作

Answer 3

尝试将

autostart="false"

添加到您的源标签。

<video width="640" height="480" controls="controls" type="video/mp4" preload="none">
<source src="http://example.com/mytestfile.mp4" autostart="false">
Your browser does not support the video tag.
</video>

JSFiddle 示例

Answer 4

要禁用自动播放，您必须完全删除

autoplay

属性。

否则会被解释为

autoplay=true

。很不明显！

Answer 5

只需在视频标签中使用

preload="none"

，页面加载时视频就会停止自动播放。

Answer 6

事实上，将

autoplay

设置为

false

并不能帮助某些视频正常播放。请参阅小提琴中的此案例。

如果您想暂停所有视频，您可能需要通过代码执行以下操作：

videos = document.querySelectorAll("video"); 
for(video of videos) {
  video.pause(); 
}

当然，如果

video

标签位于影子根元素中，则上述情况将不起作用，但几乎没有任何通用解决方案适用于影子根元素。在那里，您将需要一种自定义方法并首先扩展影子根。

Answer 7

删除所有标有

autoplay

的属性，因为它在标签中的存在是 true 的布尔简写。

此外，请确保始终使用

video

或

audio

元素。不要使用

object

或

embed

，因为这些元素默认使用第三部分插件自动播放，并且如果不更改浏览器中的设置就无法停止。

Answer 8

<video class="embed-responsive-item"  controls>
   <source src="http://example.com/video.mp4" autostart="false">
   Your browser does not support the video tag.
</video>

Answer 9

我希望在编辑模式下 autoplay="false" 但在查看器模式下 autoplay="true" 并通过仅在查看器模式下通过 jQuery 添加属性来解决它：

<video id="vid" class="my-vid" poster="https://poster-url/poster.jpg"
     loop="loop" controls="controls" width="100%" height="100%">
     <source src="https://video-url/vision.mp4" type= "video/mp4" />
</video>

<script type="text/javascript">
        if (document.location.href.indexOf('domain') > -1 ||
            document.location.href.indexOf('test') > -1) {
    
            $(document).ready(function() {
                $('video').attr('autoplay','autoplay')
         
            });
        }   

    </script>

Answer 10

2024 年什么在起作用？ 要阻止页面上的任何嵌入视频在下载期间播放，即“自动播放”，使用 autoplay="none" 或 autoplay="0"、删除单词“autoplay”或 preload="none" 不起作用。 为什么这么难？

Answer 11

可以设置

autoplay=""

<video width="640" height="480" controls="controls" type="video/mp4" autoplay="">
<source src="http://example.com/mytestfile.mp4">
Your browser does not support the video tag.
</video>

ps。要启用您可以使用

autoplay

或

autoplay="autoplay"

Answer 12

只需将 autoplay="false" 放在源标签上..:)