html5中的音频和视频标签:
<video width="320" height="240" controls="controls" autoplay="autoplay"> <source src="movie.ogg" type="video/ogg"> <source src="movie.mp4" type="video/mp4">Your browser does not support the video tag.</video>?
<audio controls="controls" autoplay="autoplay"> <source src="song.ogg" type="audio/ogg"> <source src="song.mp3" type="audio/mpeg">Your browser does not support the audio tag.</audio>
?
问题:在iphone和ipad2上,autoplay失效,每次还是要点击之后才能播放。
???????? 页面加载后调用对应的play()方法也不能播放。但是在页面上用触摸或点击事件,调用play()方法可以播放。
?
暂时的解决方法:
?????? 1、通过iframe
var ifr=document.createElement("iframe");ifr.setAttribute('src', "song.mp3");ifr.setAttribute('width', '1px');ifr.setAttribute('height', '1px');ifr.setAttribute('scrolling', 'no');ifr.style.border="0px";document.body.appendChild(ifr);
??? 2、通过页面上的其他触摸或者点击事件来调用对应的play()方法。
<!DOCTYPE html><html><head><meta charset="UTF-8"><title>测试</title><script type="text/javascript" src="jquery-1.5.min.js"></script><script type="text/javascript">$(window).load(function(){ $("#start").bind("touchstart",function(event){ var myAudio = document.getElementById("audio"); myAudio.play(); });})</script></head><body ><audio src="song.mp3" id="audio" controls></audio><br/><br/><br/><button id="start">开始</button><button id="pause">暂停</button></body></html>?