最近做了一個Echarts和Highcharts多圖多頁面連動的效果，就用到postMessage
如下介紹：
最開始在最外圍的頁面也就是所有頁面的父級頁面添加postMessage監聽事件以便監聽下面子級頁面的動態，代碼：
window.parent.addEventListener('message',function(e){
if(e.source != window.parent) return;
var names = localStorage.getItem("toName");
window.postMessage(names,'*'); //*代表所有頁面
},false)
之后在在開始的頁面寫入傳入message指令，代碼：
var objString = JSON.stringify({from:"toOne",value:data.name}); //這里就是多頁面監聽的重點，每次頁面向父級頁面傳入message的時候都是用json格式傳入，之后就能通過判斷from的來源來判斷是點擊了那幅圖要實現什么效果
var clickName = localStorage.setItem("toName",dataName); //本地保存一個點擊對象的名稱
window.parent.postMessage(data.name,'*'); //將數據的名稱上傳到父級
最后在不同頁面的調用，代碼：
window.parent.addEventListener('message',function(e){
var Title,from;
try{
var obj = JSON.parse(e.data); //轉換json字符
Title = obj.value;
from = obj.from;
}catch(er){
Title = e.data;
}
if(from=="toOne"){
//用if判斷是哪個頁面傳入的變量，對應的執行什么代碼
}else{
//不滿足上面的條件又執行什么
}
}