关于ios html video autoplay的问题

解决iOS下video标签autoplay无法正常工作的方法

最新推荐文章于 2025-01-13 14:38:50 发布

转载最新推荐文章于 2025-01-13 14:38:50 发布 · 221 阅读

1 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/hyl2015/archive/2012/11/14/2770454.html

文章标签：

#前端 #javascript #ViewUI

本文介绍了一种在iOS环境下实现video标签自动播放的解决方案，通过使用jQuery或者原生JS创建video标签，并设置事件绑定实现自动播放功能。尽管如此，在iOS中仍存在监控video标签事件的问题，有待进一步研究。

由于IOS的限制导致video标签的autoplay无法正常工作，解决办法如下：

//为了方便使用了jquery，可以换成原生js
//创建一个video标签
var __video = $("<video controls='controls'></video>").    css({'position':'absolute','left':'-500px','right':'-500px','width':'10px',height:'10px'}).appendTo('body');
设置视频文件地址
__video.attr('src',"/server/resources/classic/mobile/video/test.mp4");
//创建临时使用的a标签
var __tmpA = __tmpA || $("<a href='#'></a>").appendTo('body');
//给标签绑定事件,在标签中播放视频
__tmpA.unbind('bind').bind('click',function (e) {
    e.preventDefault();
//  通过先暂停，再播放的方式实现在ios中自动播放的效果
    __video[0].play();
    __video[0].pause();
    __video[0].play();
}).click();