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

html部分:

<audio id="audio"><source src="20161012102044_57fd9dfc044cd.mp3"></audio>

<script>

audio = document.getElementById('audio');

audio.play();

</script>

js部分:

// 函数:

function audioAutoPlay(id)

{

var audio = document.getElementById(id);

var play = function() {

document.removeEventListener("WeixinJSBridgeReady", play);

document.removeEventListener("YixinJSBridgeReady", play);

// document.removeEventListener("touchstart", play, false);

audio.play();

audio.pause();

};

audio.play();

audio.pause();

//weixin  document.addEventListener("WeixinJSBridgeReady", play, false);

//yixin   document.addEventListener('YixinJSBridgeReady', play, false);

//touch   document.addEventListener("touchstart", play, false);

}

//调用:

audioAutoPlay('audio1');

ios加载html5 audio标签用js无法自动播放的更多相关文章

  1. h5 audio标签在手机上不能自动播放????

    最近在做一个微信端的项目,快到接近尾声的时候,发现还没放入音频,于是乎,放入音频,在电脑端测试一切正常,无阻碍. 后来在手机上测试,发现背景音乐不能播放,于是开始找错,刚开始以为是IIS服务器出错,结 ...

  2. HTML5 Audio标签方法和函数API介绍

    问说网 > 文章教程 > 网页制作 > HTML5 Audio标签方法和函数API介绍 Audio APIHTML5HTML5 Audio预加载 HTML5 Audio标签方法和函数 ...

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

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

  4. HTML5 <Audio/>标签Api整理(二)

    1.实例2: 相对较完整 Html代码: <style> #volumeSlider .slider-selection { background:#bababa; } </styl ...

  5. html5 audio标签相关知识点总结

    1.audio指JS原生对象,假如用jquery获取到audio标签后,需要dom[0]转为原生JS对象 if(audio.paused){ //如果音频暂停,就播放 audio.play(); }e ...

  6. 文本溢出显示省略号,CSS未加载时a标签仍可用处理方法

    一.文本溢出打点 (1)单行文本 overflow: hidden; text-overflow:ellipsis; white-space: nowrap; (2)多行文本 overflow : h ...

  7. HTML5 <Audio>标签API整理(三)

    一.浏览器支持 Internet Explorer 9+, Firefox, Opera, Chrome, 和 Safari 都支持 <audio> 元素. 注意: Internet Ex ...

  8. CEF3 HTML5 audio标签为什么不能播放mp3格式的音频文件

    CEF3 HTML5 audio标签 为什么不能播放mp3格式的音频文件   原因略.   解决方法: 找一个最新版的chrome ,我用的是24版本.路径 C:\Documents and Sett ...

  9. 在页面所有元素加载完成之后执行某个js函数

    在页面所有元素加载完成之后执行某个js函数 http://lgscofield.iteye.com/blog/1884352

随机推荐

  1. IDEA免费激活至2099年教程,亲测可用

    申明,本教程 Intellij IDEA 最新版激活教程,激活码均收集与网络,请勿商用,仅供个人学习使用,如有侵权,请联系作者删除.如条件允许,建议大家购买正版. 以下是本人免费激活到 2099 年的 ...

  2. Oracle ORA 12541 报错解决过程

    Oracle 导入全库之后使用plsql登陆时报错 版本12C版本2 ORA-12541: TNS: No Listener 再oracle主机本地可以使用sqlplus 登陆,但是使用plsql无法 ...

  3. Python之模块导入(不看会后悔系列)

    看到这个标题猜想大家内心OS: 什么辣鸡水文,划走划走~ 别急有干货! 静态导入(照顾新人) 假设现在有两个文件a,b在不同目录,b文件想引用a文件中的函数: # test_module/sub_mo ...

  4. LeetCode 114. 二叉树展开为链表 C++

    /** * Definition for a binary tree node. * struct TreeNode { * int val; * TreeNode *left; * TreeNode ...

  5. java中使用Process执行linux命令

    代码如下 BufferedReader reader = null; String cmd = "netstat -anp|grep :8080";//命令中有管道符 | 需要如下 ...

  6. Java学习(十四)

    玩云顶连跪一晚上,搞得心态有点崩了... 源计划5-4还是一星vn,吐了. 今天学习了伪元素: 语法是 :first-letter//元素的第一个字母的位置,如果:前不加元素,默认是#(即所有元素) ...

  7. [luogu5464]缩小社交圈

    不难证明合法当且仅当满足一下两个条件: 1.每一个位置最多被覆盖两次(无环) 2.将选择的区间按左端点从小到大排序,对于每一个左端点,其之前的区间的最大右端点不小于其(连通) (关于第一个的充分性证明 ...

  8. [bzoj5462]新家

    先离线,将询问按照时间排序,维护商店出现和消失 对于每一个询问,先二分枚举答案,假设是ans, 即要求对于区间[l-ans,l+ans],商店的种类数是k(l是询问的位置) (当然需要先将所有位置离散 ...

  9. Pólya 定理学习笔记

    在介绍\(Polya\) 定理前,先来介绍一下群论(大概了解一下就好): 群是满足下列要求的集合: 封闭性:即有一个操作使对于这个集合中每个元素操作完都使这个集合中的元素 结合律:即对于上面那个操作有 ...

  10. 洛谷 P5224 - Candies(循环卷积)

    洛谷题面传送门 一道题解长度大概不到 1k 的题,可还是决定写篇题解,因为自己没有做出来( \(1004535809\) 好评( 首先这个 \(\equiv m\pmod{k}\) 有点把我们往单位根 ...