微信中音乐播放在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项目上线,我们在项目首页做个二维码,然后用户用手机扫一扫就能下载了.但是很多用户反映扫一扫之后下载不了,了解之后才知道这些用户都是使用的微信的扫一扫,而我们开发测试人员一般使 ...
随机推荐
- Spring Boot与缓存
---恢复内容开始--- JSR-107.Spring缓存抽象.整合Redis 一.JSR107 Java Caching定义了5个核心接口,分别是CachingProvider, CacheMana ...
- Go 目录
Go语言 go语言初识 基本数据类型和操作符 字符串,时间,流程控制,函数 GOROOT,GOPATH,GOBIN,project目录 数组和切片 指针和内置函数 排序和查找 map
- Django1-HTTP协议介绍
何为http协议(Hypertext Transfer Protocol,超文本传输协议)? 所谓协议,就是指双方遵循的规范.http协议,就是浏览器和服务器之间进行“沟通”的一种规范.我们在看空间, ...
- C#给字符串赋予字面值——字符串插入、转义序列的使用
1.占位符.字符串插入 给字符串赋予字面值时,经常遇见在字符串中包含变量的情况,用连接符进行拼接.转换的方式比较麻烦.还容易出错.C#提供了较为便捷的处理方式,即‘占位符’,以及C#6的新功能‘插入字 ...
- Linux几大服务
server0操作: 1.创建/devops目录,并修改其SELINUX安全上下文 # mkdir /devops # vim /devops/1.mp3# chcon -R -t samba_sha ...
- python 字典用法
d = {key1 : value1, key2 : value2 } 1.创建 dict1 = { 'abc': 456 } 2.访问/修改 dict['Name'] 3.删除 del dict[' ...
- Get Remote Computer Install Software
#requires -Version 2 function Get-Software { param ( [string] $DisplayName='*', [string] $UninstallS ...
- sql 根据身份证号码计算年龄
,), GETDATE()) / 365.25) from ConstructionInfo
- 《玩转spring全家桶》学习笔记-------------丁雪丰
一.spring 课程介绍 1.初识spring 2.数据操作 3.web开发 4.spring boot 5.spring cloud 二.初识spring Spring Boot.Spring C ...
- <数据结构基础学习>(五)递归
一. 递归 本质上,将原来的问题,转化为更小的同样的问题 举例:数组求和 Sum(arr[0... n-1]) = arr[0] + Sum(arr[1...n-1]) 第二部分为更小的同一个问题 ...