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. popStar机机对战数据生成器代码(C#)

    代码: using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; ...

  2. Element - 日期禁用集合(持续更新)

    当前日期之前的日期禁用 <el-date-picker v-model="form.startTime" type="date" placeholder= ...

  3. 自定义容器tomcat应用

    看不懂可以先去看:https://www.cnblogs.com/leihongnu/p/14506704.html 1.将103服务器上的mytomcat镜像打包为mytomcat.gz(花时间比较 ...

  4. js中的特数值-null-undefined-NaN

    一.补充 1.js中的三大特殊数据:undefined.null.NaN NaN :非法的数值运算得到的结果 特殊之处: 是一个数值型数据,但不是一个数字 NaN不等于任何值,和任何数据都不相等,Na ...

  5. 第三课 Dubbo设计中的设计模式

    责任链模式  责任链模式在Dubbo中发挥的作用举足轻重,就像是Dubbo框架的骨架.Dubbo的调用链组织是用责任链模式串连起来的. 责任链中的每个节点实现Filter接口,然后由ProtocolF ...

  6. Visual Studio中使用Macros插件给代码添加注释、时间和以及自动脚本

    title: Visual Studio中使用Macros插件给代码添加注释.时间和以及自动脚本 date: 2020-09-11 sidebarDepth: 2 tags: 代码 Visual st ...

  7. Python进阶(装饰器)

    from datetime import datetime def log(func):#func表示装饰器作用于的函数 def wrapper(*args,**kw):#wrapper返回装饰器作用 ...

  8. Python如何格式化输出

    目录 Python中的格式化输出 1.旧格式化 2.新格式format( ) 函数 Python中的格式化输出 格式化输出就是将字符串中的某些内容替换掉再输出就是格式化输出 旧格式化输出常用的有%d( ...

  9. 菜鸡的Java笔记 第二十三 - java 抽象类的概念

    abstractClass 抽象类的概念        1.抽象类的基本定义        2.抽象类的使用原则                不会抽象类与接口,java = 没学           ...

  10. 行星万象表白墙微信小程序、社交微信小程序,后台完整,支持多区域运营,扫码体验。

    简介 中国目前大概有5000个表白墙,累计用户近3000万,是一个庞大的群体,但现在大都以微信朋友圈为基础进行信息中转,但是这种模式经营者和用户都不友好,尤其是经营者无法变现,用户无法公开评论,这些种 ...