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. Harbour.Space Scholarship Contest 2021-2022 (Div. 1 + Div. 2) Editorial题解

    A 略,发现只有当末尾为9时才满足条件.. B 简单模拟,注意数组大小!!! C 简单模拟. D 比较暴力的一个做法就是每次找一个开始匹配的起始点,然后每次不同时向后跳2就行了. 注意这里最后还要判断 ...

  2. 【Go语言学习笔记】函数做参数和闭包

    函数做参数 在Go语言中,函数也是一种数据类型,我们可以通过type来定义它,它的类型就是所有拥有相同的参数,相同的返回值的一种类型.类似于重写(同名覆盖). 回调函数:函数有一个参数是函数类型,这个 ...

  3. k8s入坑之路(12)ingress-nginx安装配置四层代理

    ingress官方文档地址:http://docs.kubernetes.org.cn/  https://feisky.gitbooks.io/kubernetes/content/plugins/ ...

  4. k8s入坑之路(7)kubernetes设计精髓List/Watch机制和Informer模块详解

    1.list-watch是什么 List-watch 是 K8S 统一的异步消息处理机制,保证了消息的实时性,可靠性,顺序性,性能等等,为声明式风格的API 奠定了良好的基础,它是优雅的通信方式,是 ...

  5. C++ 函数模板实现原理剖析

    C++ 函数模板实现机制原理剖析 重点 编译器并不是把函数模板处理成能够处理任意类的函数 编译器从函数模板通过具体类型来产生不同的函数 编译器会对函数模板进行两次编译 (1)在声明的位置对模板代码进行 ...

  6. Charles--/安装/破解/支持https抓包

     一.安装破解Charles 1.下载charles4.0.2版本,下面的jar包需要和charles版本对应 2.下载地址:https://www.cr173.com/soft/494576.htm ...

  7. Linux usb 6. HC/UDC 测试

    目录 1. 背景介绍 2. Device (gadget zero) 2.1 gadget zero 创建 2.2 SourceSink Function 2.3 Loopback Function ...

  8. IO流(一)

    内容概要: Java以流的形式处理所有输入和输出.流是随通信路径从源移动到目的地的字节序列. 内存与存储设备之间传输数据的通道 流的分类: 按方向 输入流:将存储空间中的内容读到内存中   硬盘--& ...

  9. Mac下查看 Java 安装目录位置和安装数量

    /usr/libexec/java_home -V 第一个红框是安装数量, 第二个红框是目前正在使用的 JDK 版本位置

  10. 『学了就忘』Linux软件包管理 — 44、在RPM包中提取文件

    目录 1.RPM包中文件的提取 2.在RPM包中提取文件的操作 (1)cpio命令介绍 (2)提取RPM包中文件 1.RPM包中文件的提取 为什么要做这个事呢? 在操作Linux系统的时候误删除一个文 ...