IOS微信搖一搖聲音無法播放的解決辦法
在IOS中第一次調(diào)用play方法播放音頻會(huì)被阻止,必須得等用戶有交互動(dòng)作,比如touchstart,click后才能正常調(diào)用,所以可以在搖一搖之前提醒用戶點(diǎn)擊一下開始游戲的按鈕或者給用戶一個(gè)彈窗,用戶點(diǎn)擊的時(shí)候播放一個(gè)超級(jí)短的無聲音文件,之后替換src,這樣再調(diào)用play方法就可以了。
代碼如下如:
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta http-equiv="X-UA-Compatible" content="ie=edge" /> <title>Document</title> </head> <body> <button>開始游戲</button> <audio src="https://daoket.github.io/img/load.mp3" id="audio"></audio> <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script> <script type="text/javascript"> $('button').one('touchstart', function () { var audio = document.getElementById("audio"); audio.play(); audio.setAttribute('src', 'https://daoket.github.io/img/shake.mp3'); audio.load(); $(this).text('游戲進(jìn)行中'); }) /** * 移動(dòng)端搖一搖 * @params devicemotion 提供設(shè)備加速度信息 */ window.addEventListener('devicemotion', devicemotionHandler, false); var x, y, z, last_x, last_y, last_z, last_time = 0, SHAKE_SPEED = 4000; function devicemotionHandler (evet) { var acc = event.accelerationIncludingGravity, curTime = new Date().getTime(), diffTime = curTime - last_time; if (diffTime > 100) { last_time = curTime; x = acc.x; y = acc.y; z = acc.z; var speed = Math.abs(x + y + z - last_x - last_y - last_z) / diffTime * 10000; if (speed > SHAKE_SPEED) { document.getElementById("audio").play() } last_x = x; last_y = y; last_z = z; } } </script> </body> </html>
在線查看
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
ios 流媒體播放器實(shí)現(xiàn)流程及FreeStreamer的使用的示例
本篇文章主要介紹了ios 流媒體播放器實(shí)現(xiàn)流程及FreeStreamer的使用的示例代碼,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2018-01-01iOS如何利用一句話完成轉(zhuǎn)場(chǎng)動(dòng)畫
這篇文章主要給大家介紹了關(guān)于iOS如何利用一句話完成轉(zhuǎn)場(chǎng)動(dòng)畫的相關(guān)資料,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2018-08-08實(shí)例分析IOS實(shí)現(xiàn)自動(dòng)打包
本篇文章給大家分享了IOS實(shí)現(xiàn)自動(dòng)打包的相關(guān)知識(shí)點(diǎn),以及需要的操作內(nèi)容做了分享,有需要的朋友可以學(xué)習(xí)下。2018-05-05IOS 獲取已連接的wifi信息的實(shí)現(xiàn)代碼
這篇文章主要介紹了IOS 獲取已連接的wifi信息的實(shí)現(xiàn)代碼的相關(guān)資料,這里提供實(shí)現(xiàn)代碼幫助大家學(xué)習(xí)理解這部分內(nèi)容,需要的朋友可以參考下2017-08-08iOS10添加本地推送(Local Notification)實(shí)例
這篇文章主要為大家詳細(xì)介紹了iOS10添加本地推送(Local Notification)實(shí)例,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-09-09在IOS系統(tǒng)上滾動(dòng)條滾動(dòng)到指定的位置出現(xiàn)空白頁面的解決方案
這篇文章主要介紹了 在IOS系統(tǒng)上滾動(dòng)條滾動(dòng)到指定的位置出現(xiàn)空白頁面的解決方案,需要的朋友可以參考下2017-01-01iOS 本地視頻和網(wǎng)絡(luò)視頻流播放實(shí)例代碼
本篇文章主要介紹了iOS 本地視頻和網(wǎng)絡(luò)視頻流播放實(shí)例代碼,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-07-07關(guān)于ios配置微信config出現(xiàn)驗(yàn)簽失敗的問題解決
這篇文章主要介紹了關(guān)于ios配置微信config出現(xiàn)驗(yàn)簽失敗的問題解決方案,本文給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2021-04-04