微信中音乐播放在ios不能自动播放解决
在微信中,ios手机下面音乐被自动禁掉无法自动播放,我们可以执行触发body上的元素,自动进行播放。
//音乐
var x = document.getElementById("myAudio");
var at=$("#myAudio")
var audobtn=true;
function playAudio(at){
var faf=at[];
faf.play();//播放
$(".audio-btn").addClass("move1");
}
var autopa=true;
$("body").on("click",function(){
if(autopa){
playAudio(at);
autopa=false;
}
})
$(".audio-btn").on("click",function(){
if(audobtn){
$(".audio-btn").removeClass("move1");
x.pause();
audobtn=false;
}else{
$(".audio-btn").addClass("move1");
x.play();
audobtn=true;
}
})
需要引入jq以及微信的js
<script src="./jquery-1.7.2.min.js" type="text/javascript"></script>
<script src="./jweixin-1.0.0.js"></script>
<script> function autoPlayMusic() {
// 自动播放音乐效果,解决浏览器或者APP自动播放问题
function musicInBrowserHandler() {
musicPlay(true);
document.body.removeEventListener('touchstart', musicInBrowserHandler);
}
document.body.addEventListener('touchstart', musicInBrowserHandler); // 自动播放音乐效果,解决微信自动播放问题
function musicInWeixinHandler() {
musicPlay(true);
document.addEventListener("WeixinJSBridgeReady", function () {
musicPlay(true);
}, false);
document.removeEventListener('DOMContentLoaded', musicInWeixinHandler);
}
document.addEventListener('DOMContentLoaded', musicInWeixinHandler);
}
function musicPlay(isPlay) {
var audio = document.getElementById('audio2');
if (isPlay && audio.paused) {
audio.play();
}
if (!isPlay && !audio.paused) {
audio.pause();
}
};
autoPlayMusic(); // 关闭音乐
$('.music-pic').click(function () {
if($('.music-pic').hasClass('close')){
document.getElementById("audio2").muted=false;
$('.music-pic').removeClass('close');
}else {
$('.music-pic').addClass('close');
document.getElementById("audio2").muted=true;
}
});
微信中音乐播放在ios不能自动播放解决的更多相关文章
- 仿微博视频边下边播之滑动TableView自动播放-b
Tips:这次的内容分为两篇文章讲述01.[iOS]仿微博视频边下边播之封装播放器 讲述如何封装一个实现了边下边播并且缓存的视频播放器.02.[iOS]仿微博视频边下边播之滑动TableView自动播 ...
- 解决在微信中部分IOS不能自动播放背景音乐
前言在做各种HTML5场景页面的时候,插入背景音乐是一个很普遍的需求.我们都知道,IOS下的safari是无法自动播放音乐的,以至一直以来造成一种错误的认识,iso是无法自动播放媒体资源的.直到微信火 ...
- iOS - 如何自动播放H5中的音频
场景:iOS端设备,App页面跳转到H5产品介绍,背景音乐无法播放.(为什么不能自动播放,因该是iPhone人性化设定吧~) 加载H5用UIWebView空间: 代码: CGRect rect = s ...
- (IOS可自动播放)使用bxslider做了一个切换图片跟随播放MP3的功能
代码: <!DOCTYPE html> <html lang="zh-Hans"> <head> <meta charset=" ...
- 摇一摇—微信7.0.8版本audio无法自动播放问题
近日有一个项目出现audio无法自动播放,查看原因才发现是微信版本更新为7.0.8版本,需要有交互行为,第一次播放需要用户手动点击一下,无法使用DOM中的play()进行直接播放操作,那怎么办呢? 通 ...
- HTML5视频播放在ios下浮动元素无法点击的解决方案
最近许多人在微博上问到在iPad.iPhone.iTouch等设备上使用HTML5播放视频,在视频上方悬浮一个div元素,div内的元素无法点击的情况,而在PC浏览器上没有这个问题. 这个现象是设备特 ...
- Vue中swiper手动滑动后不能自动播放的解决方法
用户操作swiper之后,是否禁止autoplay.默认为true:停止.如果设置为false,用户操作swiper之后自动切换不会停止,每次都会重新启动autoplay.操作包括触碰,拖动,点击pa ...
- 在iOS微信浏览器中自动播放HTML5 audio(音乐)的2种正确方式
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 微信中打开链接,自动打开外部浏览器打开指定URL页面
上半年公司有一个新的APP项目上线,我们在项目首页做个二维码,然后用户用手机扫一扫就能下载了.但是很多用户反映扫一扫之后下载不了,了解之后才知道这些用户都是使用的微信的扫一扫,而我们开发测试人员一般使 ...
随机推荐
- 移除 iview的Table组件固定两头后box-shadow阴影效果
.ivu-table-fixed{ box-shadow:0 0 0 #fff; }
- MySQL 5.6 for Windows 解压缩版配置安装 和 MySQL 数据库的安装和密码的设定
https://jingyan.baidu.com/article/f3ad7d0ffc061a09c3345bf0.html https://jingyan.baidu.com/article/09 ...
- pixy&STM32使用记录(串口&SPI外设)
先踏踏实实的把stm32的外设串口,SPI搞清楚,不要眼高手低,看不起小事.用SPI通信将pixy的数据读出来,将数据用串口发到串口助手上,然后处理数据,利用STM32的定时器调节pwm,控制电机,先 ...
- pdfplumber库解析pdf格式
参考地址:https://github.com/jsvine/pdfplumber 简单的pdf转换文本: import pdfplumber with pdfplumber.open(path) a ...
- iptables 限制ip访问3306端口
*filter:INPUT DROP [0:0] #全部关闭:FORWARD ACCEPT [0:0]:OUTPUT ACCEPT [0:0]-A INPUT -s 172.4.4.14 -p tc ...
- cmd 常用命令
注:绿色的为比较常用的命令 命令 名称 ASSOC 显示或修改文件扩展名关联. ATTRIB 显示或更改文件属性. BREAK 设置或清除扩展式 CTRL+C 检查. CACLS 显示或修改文件的 ...
- Xilinx FPGA 移位寄存器IP延时问题
软件版本:Vivado2016.1 在使用移位寄存器IP时,对于不同延时拍数的使能延时可能会有问题. (1)32深度的可变长度移位寄存器,IP生成界面如下图所示. (2)128深度的可变长度移位寄存器 ...
- iptables防火墙规则积累
1.内网IP地址端口映射: 通过访问本机地址的3389端口,可以访问到192.168.1.139的远程桌面服务: -A PREROUTING -p tcp -m tcp --dport 3389 ...
- 通用的C#导出Excel 支持2003及2007以上版本
将数据导出到Excel,供用户下载是经常要使用到的一个功能,我这里进行了一些封装,目前已满足项目中导出的需求,使用DataReader导出Excel,支持自定义多表头,使用委托处理字段格式化及字段值的 ...
- filter的使用
(1)什么是filter 过滤器是处于客户端与服务器资源文件之间的一道过滤网,在访问资源文件之前,通过一系列的过滤器对请求进行修改,判断等,把不符合规则的请求在中途拦截或者修改.或者对响应进行过滤.拦 ...