微信中音乐播放在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项目上线,我们在项目首页做个二维码,然后用户用手机扫一扫就能下载了.但是很多用户反映扫一扫之后下载不了,了解之后才知道这些用户都是使用的微信的扫一扫,而我们开发测试人员一般使 ...
随机推荐
- [Alpha阶段]第七次Scrum Meeting
Scrum Meeting博客目录 [Alpha阶段]第七次Scrum Meeting 基本信息 名称 时间 地点 时长 第七次Scrum Meeting 19/04/11 大运村寝室6楼 35min ...
- eclipse中maven父子项目层级显示设置
第一步:window-->show view --> project explorer 第二步:小三角---> projects presentation----->hiera ...
- Nginx 常见问题
1. CreateFile() "C:\Users\zhang\Desktop\K\My Project\SSL-数字证书\Nginx配置\nginx-1.12.2/conf/nginx.c ...
- Java中的Null是什么?
对于Java程序员来说,null是令人头痛的东西.时常会受到空指针异常(NPE)的骚扰.连Java的发明者都承认这是他的一项巨大失误.Java为什么要保留null呢?null出现有一段时间了,并且我认 ...
- git忽略文件不起作用时
开始我是直接进到仓库建立了.gitignore文件,再从仓库进入到项目add时总是会添加不需要添加的文件, 后来明白应该是在哪里提交在哪里创建.gitignore文件 git忽略文件操作步骤如下: 1 ...
- 2018 API变化
- vue打包静态资源路径不正确的解决办法【转】
vue项目完成打包上线的时候很多人都会碰到静态资源找不到的问题,常见的有两个 1.js,css路径不对 解决办法:打开config/index.js,将其中的assetsPublicPath值改为’. ...
- layui——Cannot create property 'LAY_TABLE_INDEX' on number '1'
前言 用layui写的后台,PHP处理好数据传输过来的时候报错了,最后发现是数据处理成layui格式的时候出错了,直接传了json对象过来,layui需要的是一个json的数. 解决 外面套成数组即可 ...
- 使用Python操作MongoDB
MongoDB简介(摘自:http://www.runoob.com/mongodb/mongodb-intro.html) MongoDB 由C++语言编写,是一个基于分布式文件存储的开源数据库系统 ...
- django csrftoken
CSRF(跨站请求伪造) 背景知识:浏览器在发送请求的时候,会自动带上当前域名对应的cookie内容,发送给服务端,不管这个请求是来源A网站还是其它网站,只要请求的是A网站的链接,就会带上A网站的co ...