javascript - mui.back() 怎么重寫,返回到指定的ID頁面?
問題描述
我的首頁有四個頁面,實際上是一個頁面,四個ID,通過底部的nav顯示哪個ID對應的頁面。如果我在第四個ID頁面點擊返回按鈕,執行 .mui-action-back 這個控件,但是沒有反應。我應該怎么做,同樣點擊 .mui-action-back 這個控件由第四個ID頁返回到第一個ID頁面?謝謝!
<!--bottom nav--> <nav class='mui-bar mui-bar-tab anviz-bar-bottom'><a href='http://www.cgvv.com.cn/wenda/5257.html#home'> <span class='mui-icon iconfont icon-home'></span> <span class='mui-tab-label'>HOME</span></a><a href='http://www.cgvv.com.cn/wenda/5257.html#support'> <span class='mui-icon iconfont icon-support'></span> <span class='mui-tab-label'>SUPPORT</span></a><a href='http://www.cgvv.com.cn/wenda/5257.html#products'> <span class='mui-icon iconfont icon-product'></span> <span class='mui-tab-label'>PRODUCTS</span></a><a href='http://www.cgvv.com.cn/wenda/5257.html#me'> <span class='mui-icon iconfont icon-profile'></span> <span class='mui-tab-label'>ME</span></a> </nav>
<!--分別對應不同的ID--><p class='mui-slider-group roleRight anviz-animation'> <p class='mui-slider-item mui-control-content mui-active'></p> <p class='mui-slider-item mui-control-content'></p> <p class='mui-slider-item mui-control-content'></p> <p class='mui-slider-item mui-control-content'></p> </p>
當我點擊me的返回上一頁時,我希望可以回到 id 為 home 的頁面。
問題解答
回答1:哈哈哈, mui, 比較擅長 $ { 打引號 $
有且只提供思路:
對于這種page切換, 假設每個page都占滿全屏:
設置一個公共樣式: .indexHtml-page
每當頁面跳轉, .indexHtml-page -> display:none; 同時: herfId -> dispaly : block
恩, 一般每個page我都會重寫一個 header > a.mui-action-back ; 然后每一個a都有一個herfID 跳轉到他應該去的地方
那么問題來了, 如果我是共用一個 header > a.mui-action-back 要返回上一個跳過來的page, 么搞啊??
跳轉前:
<a data-goback='true' data-href='http://www.cgvv.com.cn/wenda/5257.html#support'> <span class='mui-icon iconfont icon-support'></span> <span class='mui-tab-label'>SUPPORT</span></a>添加 data-goback 與 data-href;
我目前實現的函數是要求 data-goback 與 data-href 配套使用的, 而且只使用在這種單頁page跳轉中
JS 判斷: 如果此 a[data-href] 元素 擁有data-goback, 則記錄下當前所在page的 id( 可以用sessionStroage ), 等到點擊 a.mui-action-back , 則先訪問sessionStroage(注意: 返回后應該空sessionStroage))
