最近在做一个微信端的项目,快到接近尾声的时候,发现还没放入音频,于是乎,放入音频,在电脑端测试一切正常,无阻碍。

后来在手机上测试,发现背景音乐不能播放,于是开始找错,刚开始以为是IIS服务器出错,结果经过各种测试,发现不是IIS的问题,继续找错,又以为是标签使用不当,然后当时利用html4的object 和embd标签代替,embd标签能播放声音,但是却有许多bug,总之各种舒服。

于是,经过多方询问,以及百度,最后才知道,原来是手机上的浏览器对音频、视频的自动播放功能在去年的九月底就已经屏蔽了。起初 我以为能找到办法解决这类的问题,结果找了很久,还是以失败告终。

最终,我采用了,用户触发事件,在touchstart事件中执行音乐播放开始。

h5 audio标签在手机上不能自动播放????的更多相关文章

  1. ios加载html5 audio标签用js无法自动播放

    html5 audio标签在ios 微信浏览器中是无法自动播放的,最近在做一个小的项目遇到这个问题,安卓和pc都是正常的,唯独ios不行,查阅了很多资料,找到了以下方法,也许不是最好用的方法,如果有更 ...

  2. 解决audio和video在手机端无法自动播放问题

    各大浏览器都为了节省流量,做出了优化,在用户没有行为动作时(交互)不予许自动播放 <audio src="music/bg.mp3" autoplay loop contro ...

  3. 关于微信H5页面开发中音乐不自动播放的解决方法

    我想应该有很多人在做H5场景应用.H5微刊.H5微杂志的时候加入背景音乐吧(客户需求),相信很多人一定碰过不能自动播放的时候,即使是相同的iPhone 5s也有不播放的时候,很蛋疼吧!? 之前我的解决 ...

  4. H5页面解决IOS进入不自动播放问题(微信内)

    废话少说,直接上代码. 主要还是调用微信的jdk做兼容处理.,安卓可自动播放. ($(function(){ $(function(){ /* ** 复选框*/ $('.ul-radio').on(' ...

  5. H5 audio标签

    37-audio标签 注意点: audio标签的使用和video标签的使用基本一样, video中能够使用的属性在audio标签中大部分都能够使用, 并且功能都一样 只不过有3个属性不能用, heig ...

  6. ua实现类似 www.taobao.com 在手机上打开自动转变为 m.taobao.com 的域名转换

    user-agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/47.0.25 ...

  7. H5 <audio> 音频标签自定义样式修改以及添加播放控制事件

    H5 <audio> 音频标签自定义样式修改以及添加播放控制事件 Dandelion_drq 关注 2017.08.28 14:48* 字数 331 阅读 2902评论 3喜欢 3 说明: ...

  8. 关于html5 audio 标签在ios系统上不能正常自动播放的解决办法

    由于 iOS Safari 限制不允许 audio autoplay, 必须用户主动交互(例如 click)后才能播放 audio, 因此我们通过一个用户交互事件来主动 play 一下 audio. ...

  9. iOS下Audio自动播放(Autoplay)音乐

    前几天做了一个H5活动页面,产品要求初始化播放音乐,因晓得H5 Audio标签支持Autoplay就没在意. 完了在手机上测试,发现手机上打开页面死活就是不会自动播放,点击播放按钮才可以播放,很是纠结 ...

随机推荐

  1. Android源码阅读 – Zygote

    @Dlive 本文档: 使用的Android源码版本为:Android-4.4.3_r1 kitkat (源码下载: http://source.android.com/source/index.ht ...

  2. select样式美化(简单实用)

    美化select,可以实用一个a标签将select嵌套进去,然后将<a>相对定位,在将select绝对定位,美化<a>即可 文件下载链接:https://i.cnblogs.c ...

  3. webservices接口 file &quot;/axis2-web/listsingleservice.jsp&quot; not found 问题解决

    搞了半天 ,原来是services.xml  配置的某个或者某些service 在代码中不存才.扫描的时候找不到对应的service代码所以就会报错

  4. 非旋treap模板

    bzoj3580 非旋转treap 在大神教导下发现split一段区间时先split右边再split左边比较好写 #include <cstdio> #include <cstdli ...

  5. Redis

    1. sds类型 sds为一种抽象数据结构 typedef char *sds;struct sdshdr { // buf 已占用长度int len; // buf 剩余可用长度int free;  ...

  6. TFS源代码管理的8大注意事项

    TFS源代码管理的8大注意事项 目录 源代码管理的8大注意事项... 1 1. 使用TFS进行源代码管理... 2 2. 如果代码没放在源代码管理软件里,等于它不存在... 2 3. 要早提交,常提交 ...

  7. PyAutoGUI 简介

    转载来自: https://muxuezi.github.io/posts/doc-pyautogui.html http://blog.topspeedsnail.com/archives/5373 ...

  8. python学习笔记(4)--函数

    1.函数 函数是指将一组语句的集合通过一个名字封装起来.要想执行这个函数,只需调用其函数名即可. 函数的特性: 1.减少重复代码 2.使程序变的课扩展 3.使程序变得易维护 语法定义: def pri ...

  9. 1Z0-050

    QUESTION 13 View the Exhibit.Examine the following command that is executed for the TRANSPORT table ...

  10. MongoDB 分页查询的方法及性能

    最近有点忙,本来有好多东西可以总结,Redis系列其实还应该有四.五.六...不过<Redis in Action>还没读完,等读完再来总结,不然太水,对不起读者. 自从上次Redis之后 ...