HTML5 postMessage

html 5 postmessage 方法可实现不同窗体间互相通信. 可以发送对象、数组、字符串等. 可以实现多窗口变量对象共享等功能.

发送信息

// 发送信息到子窗口.
var iframe = $("myiframe");
iframe.get(0).contentWindow.postMessage('message(string,object,array...)', 'http://yourdomain.com');

// 发送信息到父窗口
parent.postmessage('message(string,object,array...)', 'http://yourdomain.com');

接收信息

window.onmessage = function(evt){
 var data = evt.data;
}

以下是一个完整的iframe发送信息的案列.
/**index.php**/



    
     
     
    
  
      

/**iframe.php*/



    
        
        
    
    
        

html5 post message

HTML 5 Video

http://blog.denivip.ru/index.php/2012/06/html5-player-development/?lang=en

获取Video

// 原生方法获取
document.getElementById("player")

// JQuery
var player = $ ('#player')[0];

当前播放时间

// 获取当前播放时间.
var currentTime = player.currentTime;

// 设置当前播放时间.
player.currentTime = 60;

声音控制

// 静音0
player.volume = 0;

player.volume = 1;

事件绑定和移除

// 绑定一个事件.
player.addEventListener('ended', onEndFunc);

// 移出一个事件.
player.removeEventListener('ended', onEndFunc);

var onEndFunc = function() {
}

事件列表

  • onabort – 播放中断事件
  • oncanplay – 可以播放时触发的事件, 视频已加载有足够的部分
  • oncanplaythrough – 可以播放时触发的事件, 内容已经完全缓冲
  • ondurationchange – 内容的时间发生变化事件
  • onemptied – 当断开链接的时候产生的事件
  • onended – 播放结束事件.
  • onerror – 视频文件下载错误事件.
  • onloadeddata – 事件文件下载事件
  • onloadedmetadata – 元数据加载事件(metada).
  • onloadstart – 视频文件开始下载事件
  • onpause – 暂停事件
  • onplay – 开始播放事件
  • onplaying – playback event (to be run until the video stops)
  • onprogress – 视频下载进度事件(将运行直到整个内容下载)
  • onratechange – playback rate change event
  • onreadystatechange – 视频“播放器”准备状态更改事件
  • onseeked – 视频寻求结束事件
  • onseeking – an event raised at content seek
  • onstalled – 浏览器未能获得内容引发的事件
  • onsuspend – 当浏览器停止获取数据事件
  • ontimeupdate – 当播放时间发生变化时事件,能时时监控当前播放的时间
  • onvolumechange – 声音发生变化事件
  • onwaiting – 当播放停止因为下一帧的视频资源不可用触发的事件