这篇文章将为大家详细讲解有关H5混合开发IOS中遇到的坑有哪些，小编觉得挺实用的，因此分享给大家做个参考，希望大家阅读完这篇文章后可以有所收获。
创新互联建站专注于企业营销型网站、网站重做改版、永定网站定制设计、自适应品牌网站建设、H5场景定制、商城开发、集团公司官网建设、成都外贸网站建设公司、高端网站制作、响应式网页设计等建站业务，价格优惠性价比高，为永定等各大城市提供网站开发制作服务。
1. ios系统手机无法自动播放BGM
这个是苹果系统限制，默认不允许自动播放音频，往往需要点一下触发play()事件才能播放。
那么我们在页面onload后触发播放事件：
document.getElementById('music').play();到这里一般都可以播放音乐了，如果还不行，很有可能是微信的限制。这时需要调用微信接口。
页面先引入：
然后JS写入微信事件：
document.addEventListener("WeixinJSBridgeReady", function() {
document.getElementById('music').play();
}, false);这样利用微信接口调用play()事件，可以完美解决ios音频无法autoplay的问题。
2. ios系统摇一摇播放音效事件无效
在实现摇晃（引用了封装好的shake.js）手机触发某一音效这个需求时，发现在微信中，音效没有被触发。后面找到原因：在ios里并没有把自定义摇晃事件shake当成交互动作。而要播放音效，需要用户有交互动作。没有交互，音效就没被加载，那么我们先加载音效，结合上面的微信接口：
document.addEventListener("WeixinJSBridgeReady", function () {
shakeMusic.load();
}, false);load()过之后，再调用play()即可听到音效。
3. ios系统不支持动画暂停样式（animation-play-state）
H5页面一般都会有BGM，也会提供一个旋转的音乐图标供用户开启关闭音乐。我们希望当用户点击音乐按钮时图标停止旋转，再点图标顺着之前停止的位置继续跑动画。animation-play-state是最简便的方式，然而，ios不支持。
目前的解决方案是：音乐图标负责跑动画，图标父级元素负责记录停止时的转动值。
html
关于“H5混合开发IOS中遇到的坑有哪些”这篇文章就分享到这里了，希望以上内容可以对大家有一定的帮助，使各位可以学到更多知识，如果觉得文章不错，请把它分享出去让更多的人看到。
