因为苹果手机对用户的流量和安全的问题不会自动加载随我我们首先引用一个插件《jweixin-1.0.0.js》

!function (e, n) {"function" == typeof define && (define.amd || define.cmd) ? define(function () {return n(e)}) : n(e, !0)
}(this, function (e, n) {function i(n, i, t) {e.WeixinJSBridge ? WeixinJSBridge.invoke(n, o(i), function (e) {c(n, e, t)}) : d(n, t)}function t(n, i, t) {e.WeixinJSBridge ? WeixinJSBridge.on(n, function (e) {t && t.trigger && t.trigger(e), c(n, e, i)}) : t ? d(n, t) : d(n, i)}function o(e) {return e = e || {}, e.appId = L.appId, e.verifyAppId = L.appId, e.verifySignType = "sha1", e.verifyTimestamp = L.timestamp + "", e.verifyNonceStr = L.nonceStr, e.verifySignature = L.signature, e}function r(e) {return {timeStamp: e.timestamp + "",nonceStr: e.nonceStr,package: e.package,paySign: e.paySign,signType: e.signType || "SHA1"}}function c(e, n, i) {delete n.err_code, delete n.err_desc, delete n.err_detail;var t = n.errMsg;t || (t = n.err_msg, delete n.err_msg, t = a(e, t), n.errMsg = t), (i = i || {})._complete && (i._complete(n), delete i._complete), t = n.errMsg || "", L.debug && !i.isInnerInvoke && alert(JSON.stringify(n));var o = t.indexOf(":");switch (t.substring(o + 1)) {case"ok":i.success && i.success(n);break;case"cancel":i.cancel && i.cancel(n);break;default:i.fail && i.fail(n)}i.complete && i.complete(n)}function a(e, n) {var i = e, t = g[i];t && (i = t);var o = "ok";if (n) {var r = n.indexOf(":");"confirm" == (o = n.substring(r + 1)) && (o = "ok"), "failed" == o && (o = "fail"), -1 != o.indexOf("failed_") && (o = o.substring(7)), -1 != o.indexOf("fail_") && (o = o.substring(5)), "access denied" != (o = (o = o.replace(/_/g, " ")).toLowerCase()) && "no permission to execute" != o || (o = "permission denied"), "config" == i && "function not exist" == o && (o = "ok"), "" == o && (o = "fail")}return n = i + ":" + o}function s(e) {if (e) {for (var n = 0, i = e.length; n < i; ++n) {var t = e[n], o = m[t];o && (e[n] = o)}return e}}function d(e, n) {if (!(!L.debug || n && n.isInnerInvoke)) {var i = g[e];i && (e = i), n && n._complete && delete n._complete, console.log('"' + e + '",', n || "")}}function l(e) {0 != A.preVerifyState && (v || w || L.debug || M < "6.0.2" || A.systemType < 0 || V || (V = !0, A.appId = L.appId, A.initTime = b.initEndTime - b.initStartTime, A.preVerifyTime = b.preVerifyEndTime - b.preVerifyStartTime, C.getNetworkType({isInnerInvoke: !0,success: function (e) {A.networkType = e.networkType;var n = "http://open.weixin.qq.com/sdk/report?v=" + A.version + "&o=" + A.preVerifyState + "&s=" + A.systemType + "&c=" + A.clientVersion + "&a=" + A.appId + "&n=" + A.networkType + "&i=" + A.initTime + "&p=" + A.preVerifyTime + "&u=" + A.url;(new Image).src = n}})))}function u() {return (new Date).getTime()}function p(n) {I && (e.WeixinJSBridge ? n() : h.addEventListener && h.addEventListener("WeixinJSBridgeReady", n, !1))}function f() {C.invoke || (C.invoke = function (n, i, t) {e.WeixinJSBridge && WeixinJSBridge.invoke(n, o(i), t)}, C.on = function (n, i) {e.WeixinJSBridge && WeixinJSBridge.on(n, i)})}if (!e.jWeixin) {var m = {config: "preVerifyJSAPI",onMenuShareTimeline: "menu:share:timeline",onMenuShareAppMessage: "menu:share:appmessage",onMenuShareQQ: "menu:share:qq",onMenuShareWeibo: "menu:share:weiboApp",onMenuShareQZone: "menu:share:QZone",previewImage: "imagePreview",getLocation: "geoLocation",openProductSpecificView: "openProductViewWithPid",addCard: "batchAddCard",openCard: "batchViewCard",chooseWXPay: "getBrandWCPayRequest"}, g = function () {var e = {};for (var n in m) e[m[n]] = n;return e}(), h = e.document, y = h.title, S = navigator.userAgent.toLowerCase(), _ = navigator.platform.toLowerCase(),v = !(!_.match("mac") && !_.match("win")), w = -1 != S.indexOf("wxdebugger"),I = -1 != S.indexOf("micromessenger"), T = -1 != S.indexOf("android"),k = -1 != S.indexOf("iphone") || -1 != S.indexOf("ipad"), M = function () {var e = S.match(/micromessenger\/(\d+\.\d+\.\d+)/) || S.match(/micromessenger\/(\d+\.\d+)/);return e ? e[1] : ""}(), V = !1, x = !1, b = {initStartTime: u(), initEndTime: 0, preVerifyStartTime: 0, preVerifyEndTime: 0}, A = {version: 1,appId: "",initTime: 0,preVerifyTime: 0,networkType: "",preVerifyState: 1,systemType: k ? 1 : T ? 2 : -1,clientVersion: M,url: encodeURIComponent(location.href)}, L = {}, P = {_completes: []}, W = {state: 0, data: {}};p(function () {b.initEndTime = u()});var C = {config: function (e) {L = e, d("config", e);var n = !1 !== L.check;p(function () {if (n) i(m.config, {verifyJsApiList: s(L.jsApiList)}, function () {P._complete = function (e) {b.preVerifyEndTime = u(), W.state = 1, W.data = e}, P.success = function (e) {A.preVerifyState = 0}, P.fail = function (e) {P._fail ? P._fail(e) : W.state = -1};var e = P._completes;return e.push(function () {l()}), P.complete = function (n) {for (var i = 0, t = e.length; i < t; ++i) e[i]();P._completes = []}, P}()), b.preVerifyStartTime = u(); else {W.state = 1;for (var e = P._completes, t = 0, o = e.length; t < o; ++t) e[t]();P._completes = []}}), L.beta && f()}, ready: function (e) {0 != W.state ? e() : (P._completes.push(e), !I && L.debug && e())}, error: function (e) {M < "6.0.2" || x || (x = !0, -1 == W.state ? e(W.data) : P._fail = e)}, checkJsApi: function (e) {var n = function (e) {var n = e.checkResult;for (var i in n) {var t = g[i];t && (n[t] = n[i], delete n[i])}return e};i("checkJsApi", {jsApiList: s(e.jsApiList)}, (e._complete = function (e) {if (T) {var i = e.checkResult;i && (e.checkResult = JSON.parse(i))}e = n(e)}, e))}, onMenuShareTimeline: function (e) {t(m.onMenuShareTimeline, {complete: function () {i("shareTimeline", {title: e.title || y,desc: e.title || y,img_url: e.imgUrl || "",link: e.link || location.href,type: e.type || "link",data_url: e.dataUrl || ""}, e)}}, e)}, onMenuShareAppMessage: function (e) {t(m.onMenuShareAppMessage, {complete: function (n) {"favorite" === n.scene ? i("sendAppMessage", {title: e.title || y,desc: e.desc || "",link: e.link || location.href,img_url: e.imgUrl || "",type: e.type || "link",data_url: e.dataUrl || ""}) : i("sendAppMessage", {title: e.title || y,desc: e.desc || "",link: e.link || location.href,img_url: e.imgUrl || "",type: e.type || "link",data_url: e.dataUrl || ""}, e)}}, e)}, onMenuShareQQ: function (e) {t(m.onMenuShareQQ, {complete: function () {i("shareQQ", {title: e.title || y,desc: e.desc || "",img_url: e.imgUrl || "",link: e.link || location.href}, e)}}, e)}, onMenuShareWeibo: function (e) {t(m.onMenuShareWeibo, {complete: function () {i("shareWeiboApp", {title: e.title || y,desc: e.desc || "",img_url: e.imgUrl || "",link: e.link || location.href}, e)}}, e)}, onMenuShareQZone: function (e) {t(m.onMenuShareQZone, {complete: function () {i("shareQZone", {title: e.title || y,desc: e.desc || "",img_url: e.imgUrl || "",link: e.link || location.href}, e)}}, e)}, startRecord: function (e) {i("startRecord", {}, e)}, stopRecord: function (e) {i("stopRecord", {}, e)}, onVoiceRecordEnd: function (e) {t("onVoiceRecordEnd", e)}, playVoice: function (e) {i("playVoice", {localId: e.localId}, e)}, pauseVoice: function (e) {i("pauseVoice", {localId: e.localId}, e)}, stopVoice: function (e) {i("stopVoice", {localId: e.localId}, e)}, onVoicePlayEnd: function (e) {t("onVoicePlayEnd", e)}, uploadVoice: function (e) {i("uploadVoice", {localId: e.localId, isShowProgressTips: 0 == e.isShowProgressTips ? 0 : 1}, e)}, downloadVoice: function (e) {i("downloadVoice", {serverId: e.serverId, isShowProgressTips: 0 == e.isShowProgressTips ? 0 : 1}, e)}, translateVoice: function (e) {i("translateVoice", {localId: e.localId, isShowProgressTips: 0 == e.isShowProgressTips ? 0 : 1}, e)}, chooseImage: function (e) {i("chooseImage", {scene: "1|2",count: e.count || 9,sizeType: e.sizeType || ["original", "compressed"],sourceType: e.sourceType || ["album", "camera"]}, (e._complete = function (e) {if (T) {var n = e.localIds;n && (e.localIds = JSON.parse(n))}}, e))}, previewImage: function (e) {i(m.previewImage, {current: e.current, urls: e.urls}, e)}, uploadImage: function (e) {i("uploadImage", {localId: e.localId, isShowProgressTips: 0 == e.isShowProgressTips ? 0 : 1}, e)}, downloadImage: function (e) {i("downloadImage", {serverId: e.serverId, isShowProgressTips: 0 == e.isShowProgressTips ? 0 : 1}, e)}, getNetworkType: function (e) {var n = function (e) {var n = e.errMsg;e.errMsg = "getNetworkType:ok";var i = e.subtype;if (delete e.subtype, i) e.networkType = i; else {var t = n.indexOf(":"), o = n.substring(t + 1);switch (o) {case"wifi":case"edge":case"wwan":e.networkType = o;break;default:e.errMsg = "getNetworkType:fail"}}return e};i("getNetworkType", {}, (e._complete = function (e) {e = n(e)}, e))}, openLocation: function (e) {i("openLocation", {latitude: e.latitude,longitude: e.longitude,name: e.name || "",address: e.address || "",scale: e.scale || 28,infoUrl: e.infoUrl || ""}, e)}, getLocation: function (e) {e = e || {}, i(m.getLocation, {type: e.type || "wgs84"}, (e._complete = function (e) {delete e.type}, e))}, hideOptionMenu: function (e) {i("hideOptionMenu", {}, e)}, showOptionMenu: function (e) {i("showOptionMenu", {}, e)}, closeWindow: function (e) {i("closeWindow", {}, e = e || {})}, hideMenuItems: function (e) {i("hideMenuItems", {menuList: e.menuList}, e)}, showMenuItems: function (e) {i("showMenuItems", {menuList: e.menuList}, e)}, hideAllNonBaseMenuItem: function (e) {i("hideAllNonBaseMenuItem", {}, e)}, showAllNonBaseMenuItem: function (e) {i("showAllNonBaseMenuItem", {}, e)}, scanQRCode: function (e) {i("scanQRCode", {needResult: (e = e || {}).needResult || 0,scanType: e.scanType || ["qrCode", "barCode"]}, (e._complete = function (e) {if (k) {var n = e.resultStr;if (n) {var i = JSON.parse(n);e.resultStr = i && i.scan_code && i.scan_code.scan_result}}}, e))}, openProductSpecificView: function (e) {i(m.openProductSpecificView, {pid: e.productId, view_type: e.viewType || 0, ext_info: e.extInfo}, e)}, addCard: function (e) {for (var n = e.cardList, t = [], o = 0, r = n.length; o < r; ++o) {var c = n[o], a = {card_id: c.cardId, card_ext: c.cardExt};t.push(a)}i(m.addCard, {card_list: t}, (e._complete = function (e) {var n = e.card_list;if (n) {for (var i = 0, t = (n = JSON.parse(n)).length; i < t; ++i) {var o = n[i];o.cardId = o.card_id, o.cardExt = o.card_ext, o.isSuccess = !!o.is_succ, delete o.card_id, delete o.card_ext, delete o.is_succ}e.cardList = n, delete e.card_list}}, e))}, chooseCard: function (e) {i("chooseCard", {app_id: L.appId,location_id: e.shopId || "",sign_type: e.signType || "SHA1",card_id: e.cardId || "",card_type: e.cardType || "",card_sign: e.cardSign,time_stamp: e.timestamp + "",nonce_str: e.nonceStr}, (e._complete = function (e) {e.cardList = e.choose_card_info, delete e.choose_card_info}, e))}, openCard: function (e) {for (var n = e.cardList, t = [], o = 0, r = n.length; o < r; ++o) {var c = n[o], a = {card_id: c.cardId, code: c.code};t.push(a)}i(m.openCard, {card_list: t}, e)}, chooseWXPay: function (e) {i(m.chooseWXPay, r(e), e)}};return n && (e.wx = e.jWeixin = C), C}
});
/*** Created by Administrator on 2018/4/12 0012.*/

之后我们就要模拟一个点击事件了

    // 背景音乐的var audio = document.getElementById('bgMusic');var dianMusic =document.getElementById('dianMusic');var iconMusic = document.getElementsByClassName('icon-music')[0];var iconForbidMusic = document.getElementsByClassName('icon-forbidMusic')[0];function audioAutoPlay(audio) {document.addEventListener("WeixinJSBridgeReady", function () {audio.play();}, true);document.addEventListener('YixinJSBridgeReady', function () {audio.play();}, false);}audioAutoPlay(audio);

这样就ok了

转载于:https://www.cnblogs.com/1115changhao/p/10400908.html

IOS苹果手机背景音乐不能自动播放问题相关推荐

  1. 解决苹果ios端微信无法自动播放H5页面背景音乐

    最近做微信H5页面开发的时候,在页面加入背景音乐,并且设置自动播放. 在PC端模拟手机时是可以正常显示播放的,在安卓端微信上也可以正常播放,然后到苹果端微信就不能正常播放了. 找了许久的原因是苹果io ...

  2. 关于h5中背景音乐的自动播放

    音乐的自动播放属性,这里也介绍一下: <audio controls="controls" autoplay="autoplay"><sour ...

  3. 一种解决h5页面背景音乐不能自动播放的方案

    一种解决h5页面背景音乐不能自动播放的方案 场景:微信.浏览器.App 普通解决方案:采用audio标签的autoplay属性 现象: 1.大部分IOS系统和少部分Android微信不支持自动播放 解 ...

  4. ios设置音乐audio自动播放

    因为audio标签的自动播放:autoplay.在ios系统中不能自动播放,此时需要设置,在进入页面自动播放音乐. 第一步,先引入js微信 <script src="js/jweixi ...

  5. 微信背景音乐不自动播放解决

    微信背景音乐不自动播放解决 document.addEventListener('DOMContentLoaded',function (){function audioAutoPlay(){var ...

  6. html5手机不能自动播放音乐,H5案例---解决H5中背景音乐无法自动播放问题

    该楼层疑似违规已被系统折叠 隐藏此楼查看此楼 四.完整代码 您的浏览器不支持 audio标签. // 音乐播放 function autoPlayMusic() { // 自动播放音乐效果,解决浏览器 ...

  7. iOS 微信 音视频自动播放 原生接口WeixinJSBridge API(一些整理 小技巧)

    原文链接1:https://www.w3ctech.com/topic/1165 原文链接2:https://www.cnblogs.com/jasonduan/p/5635048.html 做一下整 ...

  8. 解决ios下的微信打开的页面背景音乐无法自动播放(转载)

    20160314更新 后面的项目发现,还有两个坑,需要注意下: ·本文的解决方案的核心是利用了 微信/易信 在ready的时候会有个 WeixinJSBridgeReady/YixinJSBridge ...

  9. 解决ios下的微信页面背景音乐无法自动播放问题

    前言 在做各种HTML5场景页面的时候,插入背景音乐是一个很普遍的需求.我们都知道,iOS下的safari是无法自动播放音乐的,以至一直以来形成了一种认知,iOS是无法自动播放媒体资源的.直到微信火爆 ...

最新文章

  1. spring教程极客学院,Mybatis-Plus学习总结(超详细整理
  2. 你需要知道的12个Git高级命令
  3. android 的view绘制逻辑
  4. idea设置java scala等代码自动换行
  5. 用SQL语句添加删除修改字段_常用SQL
  6. 这是一个我面试某公司的算法题目:对一个字符数组进行排序,根据给定的字符,大于它的,放在数组的左边,小于它的,放在数组的右边,且数组中的元素之间的相对位置要保持不变。...
  7. SQL Server中使用的公共数据类型
  8. swift中的let和var有什么区别?
  9. SpringBoot定义三大组件Servlet,过滤器Filter,监听器Listener
  10. linux和windows下安装python拓展包及requirement.txt安装类库
  11. 世界大了,啥子都有,全球最大中文搜"人"引擎
  12. [JNI] 开发基础(3)指针操作
  13. 数独基本规则_数独基本规则(数独游戏规则和技巧)
  14. 使用CPN Tools工具做简单的登录模型(初学者)
  15. Protell99中的铺铜设置
  16. ROS 入门基础(二) 创建publisher
  17. Android 短视频SDK
  18. 解析Linux中的VFS文件系统
  19. Java num+=1、num++与num=num+1的区别(通俗易懂,附带例子)
  20. 人力资源如何进行数据分析

热门文章

  1. ZYNQ PL采集AD7606数据PS LWIP发送
  2. SAP系统中信用控制功能详解
  3. git代码使用空格缩进
  4. 在Devil的软件三角中管理成功; 项目,项目经理和开发人员
  5. 阿里云自定义域名详细过程----hexo博客配置实测详细过程整理之二
  6. SPI的NSS硬件模式
  7. 集合的基本操作和基本运算
  8. 中职计算机联合体 模拟试题,2013年高职招生计算机类专业基础考试模拟试卷1.doc...
  9. usb3.0 ssd 测试软件,对比评测告诉你USB3.0+SSD能否干掉HDD
  10. 手机桌面左右滑屏不成功问题log分析