[MUI] mui框架實現頁面間傳值

1 ： 經過MUI封裝的openWindow 方法:

mui.openWindow({
    url:new-page-url,
    id:new-page-id,
    styles:{
      top:newpage-top-position,//新頁面頂部位置
      bottom:newage-bottom-position,//新頁面底部位置
      width:newpage-width,//新頁面寬度，默認爲100%
      height:newpage-height,//新頁面高度，默認爲100%
      ......
    },
    extras:{
      .....//自定義擴展參數，能夠用來處理頁面間傳值
    },
    createNew:false,//是否重複建立一樣id的webview，默認爲false:不重複建立，直接顯示
    show:{
      autoShow:true,//頁面loaded事件發生後自動顯示，默認爲true
      aniShow:animationType,//頁面顯示動畫，默認爲」slide-in-right「；
      duration:animationTime,//頁面動畫持續時間，Android平臺默認100毫秒，iOS平臺默認200毫秒；
      event:'titleUpdate',//頁面顯示時機，默認爲titleUpdate事件時顯示
      extras:{}//窗口動畫是否使用圖片加速
    },
    waiting:{
      autoShow:true,//自動顯示等待框，默認爲true
      title:'正在加載...',//等待對話框上顯示的提示內容
      options:{
        width:waiting-dialog-widht,//等待框背景區域寬度，默認根據內容自動計算合適寬度
        height:waiting-dialog-height,//等待框背景區域高度，默認根據內容自動計算合適高度
        ......
      }
    }
})

其中:

extras : 新窗口的額外擴展參數，可用來處理頁面間傳值；例如：

舊頁面設置:
var webview = mui.openWindow({
    url:'info.html',
    extras:{
        name:'mui'  //擴展參數
    }
});

新頁面:
mui.plusReady(function () {
   var self = plus.webview.currentWebview();
   // 或 var self = plus.webview.getWebviewById('new');
   console.log("extras:" + self.targetId);
})

可能的: 
console.log(webview.name);//輸出mui字符串

注意：擴展參數僅在打開新窗口時有效，若目標窗口爲預加載頁面，則經過mui.openWindow方法打開時傳遞的extras參數無效。

參考： http://laopo.cnblogs.com/p/50...

---

2 ： 經過HTML5本地儲存: localStorage、sessionStorage

特性檢測:

if(window.sessionStorage){
        // OK
    }else{
        // FAIL
    }

參考: http://www.cnblogs.com/firstF...

---

3 ： 利用URL傳參

在頁面跳轉的時候經過設置window.location.href添加參數，在接收參數的頁面經過window.location.search獲取參數字符串。

• 發送參數的頁面：

window.location.href = 'new.html?targetId=123'

• 接收參數的頁面：

// 獲取url中的參數
function getUrlParam (name) {
     var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
     var r = window.location.search.substr(1).match(reg);
     if (r!= null) {
        return unescape(r[2]);
     }else{
        return null;
     }
}    
//獲取url中的targetId參數
var targetId = getUrlParam('targetId');
console.log(targetId);

---

4 ： 其餘參考資料:

• MUI：頁面傳參終極版 - 青峯專欄 - 博客頻道 - CSDN.NET http://blog.csdn.net/kepoon/a...

本文地址： https://segmentfault.com/a/11...