利用html5標簽audio在不同客戶端下適配播放音頻

發(fā)布時間：2020-07-14 06:41:15 來源：網絡閱讀：1018 作者：mirwangsir 欄目：移動開發(fā)

//聲明：ios系統(tǒng)不支持falsh,故而采用各平臺支持的html5 audio標簽

//創(chuàng)建audio標簽

var audio = document.createElement("audio");

//增加audio 屬性id

audio.id = "audio";

//設置播放文件路徑

audio.src = "sound/music.mp3";

//設置是否循環(huán)播放

audio.loop = "loop";

//獲取當前客戶端環(huán)境信息

var ua = window.navigator.userAgent.toLowerCase();

//判斷當前環(huán)境并做出相應處理

if(ua.match(/iphone/i) == "iphone" || ua.match(/ipod/i) == "ipod" || ua.match(/ipad/i) == "ipad"){

//當前是ios相關環(huán)境，為canvas節(jié)點添加事件touchstart監(jiān)聽

document.getElementById("canvas").addEventListener("touchstart", function(){

//音頻播放

audio.play();

});

}else if(ua.match(/android/i) == "android"){

//對android系統(tǒng)不做處理

}else{

//對于非ios、android系統(tǒng)，則采用監(jiān)聽click事件即可

document.getElementById("canvas").addEventListener("click", function(){

//音頻播放

audio.play();

});

}

</script>

向AI問一下細節(jié)

猜你喜歡