html5 的<audio> 音频 audio的“坑”

<audio>标签是html5的一个非常有意义的特性。告别的flash的时代。它的属性有：

autoplay:音频就绪后马上播放

controls:出现该属性,向用户显示播放的控件。

loop:是否在音频结束时候从新播放

preload:如果出现该属性，则在页面加载时候进行加载。

src:要播放的音频的URL。

方法有：

load():从新加载资源。

play()：开始播放。

pause() ：暂停播放。

这些都是基础的知识点。如果我们需要让音频自动播放的时候。在iphone中，我们发现是无法实现的。

这里解决方案是在此页面的

 document.addEventListener('touchstart', function(){      document.querySelector("#musicBox").play()

}, true);

能够实现播放的功能(意思是必须手动的触发)。

要是自动触发,必须事件机制有所了解。

在Mouse事件中：

var Elem = document.getElementById('pp');Elem.addEventListener('click', function(){	alert(111)}, true);var evt = document.createEvent('MouseEvent');evt.initMouseEvent( 'click', true, true, window, 1, 12, 345, 7, 220, false, false, true, false, 0, null );Elem.dispatchEvent(evt);

同理在touch的事件中：

var Elem = document.getElementById('pp');

Elem.addEventListener('touchstart', function(){

    alert(111)

}, true);

var evt = document.createEvent('TouchEvent');

evt.initTouchEvent( 'click', true, true, window, 1, 12, 345, 7, 220, false, false, true, false, 0, null );

Elem.dispatchEvent(evt);

实现一个类似于jquery 的trigger的功能点

巴特西

html5 的<audio> 音频 audio的“坑”

最新文章

热门文章