H5頁面跳轉與傳值


 頁面之間的跳轉經常使用a標簽,使用mvc框架的都是通過訪問controller的請求方法,返回請求頁面。但本次開發,前端與后台完全分離,前端APP使用HBuider來開發,后台數據就無法使用mvc框架訪問數據的方法了。

 

       H5提供了本地存儲用戶瀏覽數據的方法,早些時候,本地存儲使用的是 cookie。但是Web 存儲需要更加的安全與快速. 這些數據不會被保存在服務器上,但是這些數據只用於用戶請求網站數據上.它也可以存儲大量的數據,而不影響網站的性能。

 

      數據以 鍵/值 對存在, web網頁的數據只允許該網頁訪問使用。

 

       主要使用的是localStorage和sessionStorage對象。 localStorage - 沒有時間限制的數據存儲; sessionStorage - 針對一個 session 的數據存儲(關閉窗口,存儲的數據清空)。

 

     1.  localStorage實現方式:

      

      (1)存儲:localStorage.setItem("name","張三");

      

       (2)獲取數據:var name=localStorage.getItem("name");

 

       (3)移除: localStorage.removeItem("name");

 

       (4)清楚所有:localStorage.clear();

 

       (5)保存非字符串,需要使用JSON轉化:

 

         存:oStorage.setItem('data', JSON.stringify(data));  取:var data = JSON.parse(oStorage.getItem('data'));

 

2.  sesstionStorage的方式與localStorage基本相同:

sessionStorage.setItem("key", "value"); var value = sessionStorage.getItem("key");

 

3.  與cookie比較:

    

       a. 它存儲容量更大 b. 每次請求,cookie都要被傳送,浪費帶寬,另外,cookie不可以跨域訪問

 

4. 頁面跳轉舉例:

 

 

mui頁面跳轉並傳值:

      function showDetails(msgSource){ mui.openWindow({ url:viewUrl+"Character1.html", id:"Character1.html", extras:{"companyID":companyID,"msgSource":msgSource,"msg_type":msg_type} }); }

 

a標簽跳轉:<a href="'+viewUrl+'Character1.html?msg_source='+data.result[i].msgSource+'"  class="more">

調用方法跳轉:</div>'+'<a href="javascripte:;" onclick="javascript:showDetails('+data.result[i].msgSource+')"  class="more">查看詳情</a>

 

頁面刷新:window.location.reload();

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM