ios加载html5 audio标签用js无法自动播放
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无法自动播放的更多相关文章
- h5 audio标签在手机上不能自动播放????
最近在做一个微信端的项目,快到接近尾声的时候,发现还没放入音频,于是乎,放入音频,在电脑端测试一切正常,无阻碍. 后来在手机上测试,发现背景音乐不能播放,于是开始找错,刚开始以为是IIS服务器出错,结 ...
- HTML5 Audio标签方法和函数API介绍
问说网 > 文章教程 > 网页制作 > HTML5 Audio标签方法和函数API介绍 Audio APIHTML5HTML5 Audio预加载 HTML5 Audio标签方法和函数 ...
- 关于html5 audio 标签在ios系统上不能正常自动播放的解决办法
由于 iOS Safari 限制不允许 audio autoplay, 必须用户主动交互(例如 click)后才能播放 audio, 因此我们通过一个用户交互事件来主动 play 一下 audio. ...
- HTML5 <Audio/>标签Api整理(二)
1.实例2: 相对较完整 Html代码: <style> #volumeSlider .slider-selection { background:#bababa; } </styl ...
- html5 audio标签相关知识点总结
1.audio指JS原生对象,假如用jquery获取到audio标签后,需要dom[0]转为原生JS对象 if(audio.paused){ //如果音频暂停,就播放 audio.play(); }e ...
- 文本溢出显示省略号,CSS未加载时a标签仍可用处理方法
一.文本溢出打点 (1)单行文本 overflow: hidden; text-overflow:ellipsis; white-space: nowrap; (2)多行文本 overflow : h ...
- HTML5 <Audio>标签API整理(三)
一.浏览器支持 Internet Explorer 9+, Firefox, Opera, Chrome, 和 Safari 都支持 <audio> 元素. 注意: Internet Ex ...
- CEF3 HTML5 audio标签为什么不能播放mp3格式的音频文件
CEF3 HTML5 audio标签 为什么不能播放mp3格式的音频文件 原因略. 解决方法: 找一个最新版的chrome ,我用的是24版本.路径 C:\Documents and Sett ...
- 在页面所有元素加载完成之后执行某个js函数
在页面所有元素加载完成之后执行某个js函数 http://lgscofield.iteye.com/blog/1884352
随机推荐
- oeasy教您玩转vim - 56 - # 字符可视化模式
可视化编辑 回忆上节课内容 我们学习了关于模式匹配中使用参数 单个参数 :%s/<h2>\(.*\)</h2>/ - \1/g 多个参数 :%s/<img src=\ ...
- Go语言核心36讲(Go语言进阶技术十二)--学习笔记
18 | if语句.for语句和switch语句 现在,让我们暂时走下神坛,回归民间.我今天要讲的if语句.for语句和switch语句都属于 Go 语言的基本流程控制语句.它们的语法看起来很朴素,但 ...
- linux下c语言实现简单----线程池
这两天刚好看完linux&c这本书的进程线程部分,学长建议可以用c语言实现一个简单的线程池,也是对线程知识的一个回顾与应用.线程的优点有好多,它是"轻量级的进程",所需资源 ...
- Jenkins 邮件发送
1.jenkins新建任务 2.配置svn 3.maven项目构建配置pom.xml 使用maven命令 clean test 构建前清除: 4.系统管理 => 插件管理 =>可选安装邮件 ...
- 浅谈springboot自动配置原理
前言 springboot自动配置关键在于@SpringBootApplication注解,启动类之所以作为项目启动的入口,也是因为该注解,下面浅谈下这个注解的作用和实现原理 @SpringBootA ...
- 什么是齐博x1标签
X系列的标签跟V系列的标签区别还是很大的.在V系列的时候,只有一种很简单的标签比如$label[XXXX]以前的标签相对现在的来说太简单的点,所以在功能上也比较受限.X系列目前有几下几种标签 {qb: ...
- Part 16 ng include directive in AngularJS
ng-include directive is used to embed an HTML page into another HTML page. This technique is extreme ...
- Python学习周总结(二)
Python-SecondWeek知识汇总 本周学了好多内容,最头痛的地方还是自己的思维逻辑不过关,还是敲的代码比较少,一个员工管理系统,第一天写搞得头大 ,结果第三遍自己突然懂了,个人的努力才是自己 ...
- PHP高级特性-反射Reflection以及Factory工厂设计模式的结合使用[代码实例]
PHP高级特性-反射以及工厂设计模式的结合使用 [结合 Laravel-Admin 代码实例讲解] 利用反射来实现工厂模式的生产而无需创建特定的工厂类 本文地址http://janrs.com/?p= ...
- ABP Framework 5.0 RC.1 新特性和变更说明
.Net 6.0 发布之后,ABP Framework 也在第一时间进行了升级,并在一个多星期后(2021-11-16)发布了 5.0 RC.1 ,新功能和重要变更基本已经确定. 5.0版本新特性 新 ...