html5自动播放视频

男娘i 2022-03-01 14:14 421阅读 0赞

html5可以直接播放视频。就用标记`<video>`即可，真好。

可是怎么自动播放视频？

不是有"autoplay"吗？但是，无效。任凭你设属性，或是`video.play()`都无济于事。非要你手动点击才能播放。

后来才知道，需要设置静音属性autoplay才起作用！真是太细心了！设想我们无意中打开一个爱情动作片，叫声很大，而且好死不死，是在一个重要的高级会议场合，怎么破？

代码如下：

<!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>视频播放</title>
        <style>
            html,body{ 
                margin: 0;
                width:100%;
                height: 100%;
            }
            #video1{ 
                width:350px;
                height:280px;
            }
            .hidden{ 
                display:none;
            }
        </style>
        <script type="text/javascript" src="/static/js/jquery-1.8.3.min.js"></script>
    </head>
    <body>
        <div>
            <video id="video1" muted="muted" autoplay="autoplay" src="" controls="controls">
            </video>
        </div>
    </body>
    <script type="text/javascript">
        $(function(){ 
    		var video = document.getElementById("video1");
            video.src = "http://192.168.0.98:20000/v1.mp4";
            video.play();
        });
    </script>
    </html>

muted="muted" autoplay="autoplay"

muted，静音之意。多么生僻的单词，为啥不是quiet？或者干脆叫“shut up”

发表评论取消回复

表情：

评论列表（有 0 条评论，421人围观）

还没有评论，来说两句吧...

相关阅读

相关 HTML5 视频播放

![Center][] 具体代码实现  <!-- <video src=

冷不防/ 2024年02月17日 17:50/ 0 赞/ 48 阅读

相关 HTML_插入视频并自动播放

<video autoplay="autoplay" loop="loop" id="video" x-webkit-airplay="true" webkit-pla

朱雀/ 2023年03月13日 13:51/ 0 赞/ 189 阅读

相关 html5学习(多媒体，播放视频)

> html5学习(多媒体，播放视频) > > 播放视频主要是使用<video></video>标签，我本篇文章只是抛砖引玉，还有很多<video>标签的api我没列举

浅浅的花香味﹌/ 2022年12月31日 06:21/ 0 赞/ 173 阅读

相关 html5视频播放解决方案

html5没学习之前总觉的很神秘。近期通过学习和研究html5有点成果，特总结分享给大家。众所周知应用开发分两种：一是原生的native app 二是web ap

秒速五厘米/ 2022年09月23日 11:59/ 0 赞/ 257 阅读

相关 html5视频播放解决方案

关键词：html5 nativeapp webapp mp4 H.264 html5没学习之前总觉的很神秘。近期通过学习和研究html5有点成果，特总结分享给

桃扇骨/ 2022年07月21日 11:14/ 0 赞/ 291 阅读

相关 html5_视频播放

1. 视频播放 <table> <tbody> <tr> <td style="background:rgb(213,213,213);"><p><stro

悠悠/ 2022年05月25日 05:08/ 0 赞/ 382 阅读

相关 html5视频播放

<!DOCTYPE html> <head> <meta charset=utf-8> <title>html5播放器</title>

逃离我推掉我的手/ 2022年03月18日 09:24/ 0 赞/ 422 阅读

相关 html5自动播放视频

html5可以直接播放视频。就用标记`<video>`即可，真好。可是怎么自动播放视频？不是有"autoplay"吗？但是，无效。任凭你设属性，或是`video.pla

男娘i/ 2022年03月01日 14:14/ 0 赞/ 422 阅读

相关 html5视频插件video不自动播放解决

视频不能自动播放，而不能像网上的很多视频那样一开始就能播放（边下边放），造成这个问题的原因是一些描述mp4文件信息的`moov atom`元数据默认放置在了视频文件的最后，而所

ゞ浴缸里的玫瑰/ 2022年02月13日 00:07/ 0 赞/ 904 阅读

相关网页嵌入Bilibili HTML5视频播放

Bilibili好在无广告，速度也挺快，无奈B站官方的视频嵌入是Flash的形式，但B站又是支持HTML5播放的，那么问题来了，外站如何嵌入HTML5的播放形式呢？参考了这

深藏阁楼爱情的钟/ 2022年01月12日 01:17/ 0 赞/ 440 阅读