hbuilder開發的app應用,可以用5+傳參,就不說了,官網有介紹
那麼開發移動web項目的話,頁面傳參怎麼傳?
數據獲取方式:所有數據都是通過ajax從後臺接口獲得,跟開發app獲取數據的方式一樣
問題:不能用5+的 extra 或者 fire()進行頁面傳參,怎麼辦?
解決:通過localStorage存儲臨時數據,用完後再清空localStorage,實現頁面之間傳參
例如:article-list.html 把文章的 id 傳給 article-detail.html
關鍵代碼:
article-list.html 存儲文章id到localStorage 關鍵代碼:
<!-- html 部分 -->
<html>
<body>
<ul>
<!--下面的 data-aid="23" 應該是動態添加的,這裏爲了演示方便,就寫了個死數據 -->
<li onclick="clicked()" data-aid="23" >點我跳轉,並把 23 傳給文章詳情頁 </li>
</ul>
</body>
</html>
<!-- javascript 部分 需要先加載mui.min.js 和 jquery.min.js -->
<script>
//通知點擊監聽
function clicked(){
//動態獲取文章id,文章id存儲在 data-aid 標籤裏
var aid = $(this).attr("data-aid");
//設置本地存的文章id
console.log("頁面的文章id爲:"+aid); //輸出爲 "頁面的文章id爲:23"
localStorage.setItem("article_id",aid);
//頁面跳轉,go_page()是我自己封裝的跳轉函數,大家可以用mui.openWindow()來跳轉,效果一樣
go_page("article-detail.html");
});
</script>
article-detail.html 獲取localStorage 裏的文章id 關鍵代碼:
//獲取本地存儲文章id
var article_id = localStorage.getItem("article_id");
console.log("本地存儲的文章id爲:"+article_id);//輸出爲 "本地存儲的文章id爲:23"