html5中我写的video为什么不能自动播放视频 30

 我来答
程序员养大闸蟹
2018-06-22 · 自家的蟹塘,苏州阳澄湖蓝标大闸蟹养殖户
程序员养大闸蟹
采纳数:2362 获赞数:20622

向TA提问 私信TA
展开全部

HTML5 video是影片标签,可以在浏览器中很容易的插入影片,还能够设定影片长、宽、增加影片播放控制列、是否自动播放、是否自动重覆播放等功能,虽然使用HTML5 video影片标签来播放影片相当的容易,但现阶段要考虑浏览器的支援情形,例如IE 9才开始支援HTML5 video标签,其他主流的浏览器如Firefox、Chrome、Opera、Safari都有支援,但影片格式也有所差异,后方介绍。

HTML5 video影片标签语法

<video src="影片连结" controls></video>

HTML 5 <video>标签里的src是最重要的属性,影片连结就放在src=的右方引号内,另外可以加入几个控制选项属性,例如加入controls会出现控制功能列、加入width可以设定影片宽度、加入height可以控制影片高度、加入loop可以重覆播放、加入autoplay可以在影片准备好时自动播放、加入preload会在网页载入时就准备播放,不过如果同时使用autoplay与preload,会以autoplay属性为主。

浏览器对HTML5 video影片标签以及影片格式的支援

HTML 5目前所支援的影片格式有三种,分别为ogg、mpeg 4、WebM,这么多种格式不知道要怎么选择也没关系,<video>标签有支援多重影片功能,也就是说,可以将同一个影片,准备三种不同的格式,当网友用不同的浏览器开启时,<video>标签会自动根据当时的浏览器,播放适合该浏览器所支援的影片格式,这样就解决不知道该用哪种格式的问题了,但像是IE 7、IE 8等较旧的浏览器,本身并不支援<video>标签,所以依然无法顺利播放影片,以下准备了一张表格,提供给各位参考。

这张表上的浏览器支援影片格式可能随着浏览器的进化而有所改变,建议在使用影片格式同时,多测试当时的各家浏览器支援情况,目前看来Opera与IE的支援格式刚好相反,Safari与IE的支援格式刚好相同,而Chrome则是所有格式都支援,Google果然是HTML 5支持者。虽然有三种格式可以选择,但其实仔细看,不难发现,准备ogg与mp4两种格式,就可以满足大部分的浏览器了。

可以实现播放,这是我们的测试代码

<video width="500px" height="500px" controls="controls" autoplay="autoplay">

<source src="1.mp4" type="video/ogg" />

</video>

效果图:

我欲成社
高粉答主

2015-11-16 · 醉心答题,欢迎关注
知道顶级答主
回答量:4.9万
采纳率:71%
帮助的人:1.2亿
展开全部
HTML5中的video和audio标签中有一个autoplay属性,添加这个属性后就会在文件加载完成以后自动播放。
具体代码如下:
video:
<video autoplay="autoplay">
<source src="视频路径" />
</video>
audio:
<audio autoplay="autoplay">
<source src="视频路径" />
</audio>
除此属性外还有如下属性:
controls:如果出现该属性,则向用户显示控件,比如播放按钮。
height:设置视频播放器的高度。

loop:如果出现该属性,则当媒介文件完成播放后再次开始播放。
URL:要播放的视频的 URL。
preload:如果出现该属性,则视频在页面加载时进行加载,并预备播放。不与autoplay同用。
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
ok独一无二LXJ
2018-08-24
知道答主
回答量:15
采纳率:0%
帮助的人:6.1万
展开全部
chrome://flags/#autoplay-policy
设置成 no user gesture is required 就好了。
把浏览器的模式设置一下就可以自动播放了。
因为video可能加载各种视频,自动播放会有一定的不安全性。
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
imfe888
2018-07-27
知道答主
回答量:18
采纳率:0%
帮助的人:6.5万
展开全部

谷歌浏览器从Chrome 66,2018年1月1日用视频自动播放接口功能了,原有的autoplay属性已经废除,所以死心吧。

详情:网页链接

已赞过 已踩过<
你对这个回答的评价是?
评论 收起
匿名用户
2015-06-28
展开全部
<!DOCTYPE html>

<html>

<head>

<title>Simple JavaScript Controller</title>

<script type="text/javascript">

function playPause() {

var myVideo = document.getElementsByTagName('video')[0];

if (myVideo.paused){

myVideo.play();
}
else{

myVideo.pause();
}
}
</script>

</head>

<body>

<div class="video-player" align="center">

<video src="myMovie.m4v" poster="poster.jpg" onclick="playPause()" ></video>

</div>

</body>

</html>
本回答被网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 更多回答(9)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式