100%解决ios上audio不能自动播放的问题
由于ios的安全机制问题,不允许audio和video自动播放,所以想要使audio标签自动播放那是实现不了的,即使给play()也是播放不了。
解决方法:
首先,创建audio标签:<audio id="success_music" src="/success.mp3" preload="auto"></audio>,preload为自动加载
接下来,创建script标签,先获取audio对象
var audio_success = document.getElementById('success_music');
给页面一个触发动作:
$("#start").on('click',function(){
audio_success.play();
audio_success.pause();
$.get("/test/test", function() {
audio_success.play();
});
});
重点:
先播放,后暂停,之后的播放就没问题了
线上实际项目已应用,请不要置疑!
有需要短网址服务的,请访问:http://www.urlc.cn OR http://t.urlc.cn
100%解决ios上audio不能自动播放的问题的更多相关文章
- 解决ios下audio不能正常播放的问题
解决ios下audio不能正常播放的问题 ios系统下会自动屏蔽audio标签的自动播放,需要使用一个事件来驱动音频播放 this.$refs.startaudio.addEventListener( ...
- ios html5 audio 不能自动播放
//修复ios 浏览器不能自动播放音频的问题 在加载时创建新的audio 用的时候更换src即可 Xut.fix = Xut.fix||{}; if (Xut.plat.isBrowser & ...
- 关于html5 audio 标签在ios系统上不能正常自动播放的解决办法
由于 iOS Safari 限制不允许 audio autoplay, 必须用户主动交互(例如 click)后才能播放 audio, 因此我们通过一个用户交互事件来主动 play 一下 audio. ...
- 在iOS微信浏览器中自动播放HTML5 audio(音乐)的2种正确方式
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- audio微信自动播放以及自定义样式
audio标签如下: <audio id="audioTag" src="" autoplay="autoplay" controls ...
- 摇一摇—微信7.0.8版本audio无法自动播放问题
近日有一个项目出现audio无法自动播放,查看原因才发现是微信版本更新为7.0.8版本,需要有交互行为,第一次播放需要用户手动点击一下,无法使用DOM中的play()进行直接播放操作,那怎么办呢? 通 ...
- iOS 微信 音频 视频自动播放
iOS 微信 音频 视频自动播放 http://www.w3ctech.com/topic/1165
- ios audio不能自动播放
今天做了一个简单的落地页项目,就是类似于手机微信上经常看到的滑动效果.因为公司要求需要自己开发,所以我就用swiper+swiper.animate开发,开发速度很快,只不过最后音乐哪里出现了一点小b ...
- audio的自动播放报错解决
使用audio标签时,当前页面没有进行交互时,比如用户刷新了页面后,play()调用就会报错,如下图 查找资料后,发现是2018年4月以后,chrome浏览器对这块进行了优化,为了节约流量,禁止了自动 ...
随机推荐
- 简单sql注入学习
sql注入是什么? 所谓SQL注入,就是通过把SQL命令插入到Web表单提 交或输入域名或页面请求的查询字符串,最终达到欺骗服务器执行恶意的SQL命令.具体来说,它是利用现有应用程序,将(恶意)的SQ ...
- JEasyPoi 2.1.4 (Jeecg订制) 版本发布,Excel 和 Word 简易工具类
JEasyPoi 2.1.4 (jeecg订制)版本发布,EasyPoi Excel 和 Word 简易工具类 easypoi 功能如同名字easy,主打的功能就是容易,让一个没见接触过poi的人员 ...
- Microsoft Azure Storage Exployer使用指南
概述 Microsoft Azure Storage Exployer 是微软官方推荐的一款管理Azure Storage 客户端工具,客户使用完全免费.支持Windows.Mac和Linux.用户使 ...
- <经验杂谈>前端form提交导出数据
之前在做列表的是总会遇到一些导出的功能,而在做导出的时候总是习惯于用get的方法将参数放在url上,这样一来就会有很多的弊端,一是url的参数长度有限,遇到有的参数很长的时候就会报错,二是也不太安全. ...
- python+selenium自动化软件测试(第10章):测试驱动TDD
测试驱动开发模式,要求开发在写业务代码的时候,先写出测试代码,同时单元测试例子决定了如何来写产品的代码,并且不断的成功的执行编写的所有的单元测试例子,不断的完善单元测试例子进而完善产品代码, 这样随着 ...
- Linux程序写入oralce数据库中文显示为问号??? 代码实现设置环境变量!
Linux程序写入oralce数据库中文显示为问号??? 1.问题介绍 根本原因是字符集的问题,是数据库的字符集和写入程序的linux系统的字符集不一致导致: 但是用export NLS_LANG=& ...
- linux(十)之初始化文件
前面写了很多linux的知识,其实很多都是命令的,所以要去多多的练习才能学的更好,加油为了好工作. 要么现在懒惰,未来讨饭.要么现在努力,未来惬意. 一.初始化文件概述 1.1.概述 系统初始化文件是 ...
- mongodb菜鸟整理
一,mongodb的安装与连接 从官网下载后,解压或者安装到某个目录下 1 首先需要自己创建一个db文件夹 ,用于存放数据库的数据 然后还需要创建一个log文件夹,里面需要自己创建一个mongodb ...
- [js高手之路]node js系列课程-创建简易web服务器与文件读写
web服务器至少有以下几个特点: 1.24小时不停止的工作,也就是说这个进程要常驻在内存中 2.24小时在某一端口监听,如: http://localhost:8080, www服务器默认端口80 3 ...
- Spring 事务管理笔记
本文为 Spring 框架的事务管理学习笔记,官网文档地址为:Transaction Management,隔离级别及传播属性解释来自 org.springframework.transaction. ...