不要问我为什么在手机浏览器不能自动播放视频跟音频

首先,移动端浏览器大部分是禁用video和audio的autoplay功能;

并且,很多移动浏览器也不支持首次js调用play方法进行播放。

这样做主要是为了防止不必要的自动播放浪费流量。

要实现可以播放音频文件,不能隐藏播放的控件。

js方法调用play的代码:

<script>
   $(function(){
        $("#body").on("touchstart",function(){
     audio.play();
    });
     });
</script>
<audio src="a.mp3" controls="controls" autoplay="autoplay" loop="true"hidden="true"></audio>
 controls="controls"  : 显示音乐控件;
autoplay="autoplay"   :  自动播放;
loop="true"       :  循环播放;
hidden="true"    : 隐藏。
时间: 2024-10-12 09:00:45

不要问我为什么在手机浏览器不能自动播放视频跟音频的相关文章

手机浏览器自动播放视频video(设置autoplay无效)的解决方案

1.问题的提出 某一天接了个需求,需要在手机的H5页面内加入视频,我开开心心做完,准备交付的时候,问题来了,PM想要用户一进入页面,视频就开始播放,不需要用户手动点击. 2.尝试解决 加autoplay "视频自动播放"这个需求是ok的,那我就在video标签上加个autoplay属性嘛,在PC端浏览器里面试了一下,运行流畅,没有遇到什么问题,但是放在手机浏览器里面打开,就跟没设置autoplay是一样的. 监听canplay 那不行的话,我在页面加载完成的时候,监听video的can

在iOS微信浏览器中自动播放HTML5 audio(音乐)的2种正确方式

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"

audio在浏览器中自动播放

audio 在浏览器中自动播放 //使用autoplay属性 var src = "./award.wav"; var body = document.getElementsByTagName("body")[0]; if (body.getElementsByTagName("audio").length <= 0) { var audio = document.createElement("audio"); audi

ubuntu安装flash后浏览器扔无法播放视频

1.在ubuntu软件中心里将原有的flash插件卸载 2.进入https://get.adobe.com/flashplayer,选择 tar.gz 安装包,下载 3.执行如下命令: tar zxvf install_flash_player_11_linux.i386.tar.gz sudo cp libflashplayer.so /usr/lib/mozilla/plugins/ cd /usr/lib/mozilla/plugins/ sudo chmod 774 libflashpl

手机浏览器下IScroll中click事件

产品的h5页面几乎都使用了iscroll插件,如果a标签在iscroll里,在部分手机浏览器中会出现无法点击的情况,不管是绑定click事件还是使用a标签的href属性.href属性偶尔还会能点击,click事件完全不能. 如果用button或input代替a,都能响应click事件. 如果用微信内置浏览器,都能响应click事件(nubia除外).QQ浏览器也能响应. 也就是出现此问题跟手机本地浏览器,iscroll,a标签都有关系. iScroll uses various techniqu

微信或手机浏览器在线显示office文件(已测试ios、android)

最近开发微信企业号,发现微信andriod版内置浏览器在打开文件方面有问题,但是ios版没有问题,原因是ios版使用的是safari浏览器 支持文档直接打开,但是andriod版使用的是腾讯浏览器x5内核,不知道什么原因不支持,可能是集成出现的问题,这里提供解决方法,这种方法也同样适用手机浏览器或者安卓开发.通过此方法可以在微信上开发自己的第三方应用,或者解决自己的项目问题,解决方法及核心代码如下: 1.判断浏览器类型 HttpServletRequest req = ServletAction

把cookie以json形式返回,用js来set cookie.(解决手机浏览器未知情况下获取不到cookie)

1.继上一篇随笔,链接点我,解决手机端cookie的问题. 2.上次用cookie+redis实现了session,并且手机浏览器可能回传cookies有问题,所以最后用js取出cookie跟在请求的url后面. 3.但是今天发现了新的问题,js取cookie存的sessionId为空,情况如下: (1)QQ浏览器能获取某些cookie,另一些cookie获取为空,猜测是后台Response SetCookie的时候,手机端浏览器没能良好的接受. (2)UC浏览器测试正常. (3)Safari情

十分简洁的手机浏览器 lydiabox

没有地址栏,没有工具栏:web app无需下载,无需安装,无需更新,添加即用:再也不用记住网址,更不用输入网址--一款这样极简极方便的浏览器,你想要吗? 我们做了一个十分简洁的手机浏览器,这个浏览器也是@IDG校园创业大赛 的获奖作品,让web app像native app那样运行,并且支持PhoneGap API,both iOS and Android.体验地址:http://t.cn/RhuFdwx phonegap api支持演示:http://v.youku.com/v_show/id

在PC上测试移动端网站和模拟手机浏览器的5大方

查了很多资料,尝试了大部分方法,下面将这一天的努力总结下分享给大家,也让大家免去看那么多文章,以下介绍的方法,都是本人亲自测试成功的方法,测试环境winxp. 一.Chrome*浏览器 chrome模拟手机总共有四种方法,原理都一样,通过伪装User-Agent,将浏览器模拟成Android设备.以下标星的为推荐方法. 1.新建Chrome快捷方式 右击桌面上的Chrome浏览器图标,在弹出的右键菜单中选择"复制",复制一个图标副本到桌面.右击该副本,选择"属性",