首頁(yè) 猿問(wèn) 頁(yè)面跳轉(zhuǎn)后返回原頁(yè)面回到原頁(yè)面跳轉(zhuǎn)...

頁(yè)面跳轉(zhuǎn)后返回原頁(yè)面回到原頁(yè)面跳轉(zhuǎn)前的位置怎么實(shí)現(xiàn)？

Android Html5 JavaScript

慕粉1430088708 2017-05-22 09:28:31

移動(dòng)端A頁(yè)面用了iscroll插件滾動(dòng)顯示訂單，通過(guò)幾次ajax加載更多的訂單后點(diǎn)擊訂單詳情跳轉(zhuǎn)到訂單詳情B頁(yè)面，要求是從B頁(yè)面返回時(shí)（如安卓手機(jī)點(diǎn)擊安卓手機(jī)的返回鍵）不刷新頁(yè)面并停留在點(diǎn)擊訂單詳情的那個(gè)訂單的位置上？用了history，onbeforeunload好像都實(shí)現(xiàn)不了，如果A頁(yè)面沒(méi)經(jīng)過(guò)ajax加載更多怎么實(shí)現(xiàn)，若加載了幾次又怎么實(shí)現(xiàn)呢

查看完整描述

1 回答

已采納

woshiajuana

TA貢獻(xiàn)211條經(jīng)驗(yàn) 獲得超152個(gè)贊

你都不做數(shù)據(jù)緩存嗎，如果沒(méi)有用到框架，那思路可以這樣

假如一頁(yè)有20項(xiàng)數(shù)據(jù)，下拉每次加載10條，然后你要把這些數(shù)據(jù)都給存在session Storage中，然后你跳轉(zhuǎn)訂單詳情的時(shí)候要把滾動(dòng)條的位置緩存在session Storage，再一次回退到這個(gè)頁(yè)面到時(shí)候，先去取數(shù)據(jù)，然后再讓滾動(dòng)條滾動(dòng)到你記錄的位置即可

流程就是訂單頁(yè)，先去判斷sessionStorage有沒(méi)有緩存訂單數(shù)據(jù)，如果有，則獲取訂單數(shù)據(jù)渲染頁(yè)面，再獲取sessionStorage中的位置信息，如果位置信息沒(méi)有，則滾動(dòng)距離默認(rèn)為0，有的話讓滾動(dòng)條滾動(dòng)到指定位置。如果sessionStorage中沒(méi)有訂單數(shù)據(jù)，則先用ajax去獲取訂單數(shù)據(jù)，然后執(zhí)行存儲(chǔ)sessionStorage

下拉加載數(shù)據(jù)，把數(shù)據(jù)要與之前請(qǐng)求的數(shù)據(jù)合并在同一個(gè)數(shù)組里，然后再緩存在sessionStorage中

跳訂單詳情頁(yè)面的時(shí)候，記得緩存滾動(dòng)條的位置

1 反對(duì) 回復(fù) 2017-05-22

慕粉1430088708
非常感謝回答，我這的業(yè)務(wù)情況是訂單列表包裹在iscroll插件下的，每次ajax向后臺(tái)傳條件從而返回?cái)?shù)據(jù)到頁(yè)面再進(jìn)行渲染，這個(gè)條件不止是分頁(yè)數(shù)還有其他篩選條件，如果從緩存中取數(shù)據(jù)那下一次加載就不能保證是在篩選條件下需要的數(shù)據(jù)，你的解決方法對(duì)于只有分頁(yè)數(shù)作為條件的自動(dòng)加載滾動(dòng)成立我發(fā)現(xiàn)IOS上點(diǎn)擊訂單詳情返回上一頁(yè)是直接讀的緩存，頁(yè)面并未刷新并直接記錄跳轉(zhuǎn)前的狀態(tài)（不考慮新數(shù)據(jù)插入得刷新頁(yè)面的情況），這個(gè)能不通過(guò)js滾動(dòng)而直接用瀏覽器緩存實(shí)現(xiàn)么

回復(fù) 2017-05-22
woshiajuana
不沖突的呀，無(wú)論是分頁(yè)加載還是下拉加載還是篩選，你都是把篩選的條件傳遞給后臺(tái)，后臺(tái)開(kāi)發(fā)返回給你json數(shù)據(jù) 例如你訂單頁(yè)首次進(jìn)來(lái)，用一個(gè)變量去存儲(chǔ)用戶的篩選條件，首次進(jìn)來(lái)，用戶當(dāng)然沒(méi)有篩選，請(qǐng)求20條數(shù)據(jù)，用戶滑動(dòng)頁(yè)面，看到最后一條數(shù)據(jù)，觸發(fā)下拉再次去請(qǐng)求第二頁(yè)的數(shù)據(jù)。把得到的數(shù)據(jù)與之前的數(shù)據(jù)放在一起。這個(gè)時(shí)候用戶輸入篩選條件，點(diǎn)擊篩選，你記錄一下用戶的篩選條件，重新把用戶的篩選條件傳遞給后臺(tái)，后臺(tái)返回json數(shù)據(jù)，下拉觸發(fā)重新請(qǐng)求，因?yàn)槟愫Y選條件變量存儲(chǔ)有用戶的篩選條件，請(qǐng)求的就是第二頁(yè)篩選的數(shù)據(jù) 這個(gè)你得找開(kāi)發(fā)配合一下，比如定一個(gè)條件字段x,當(dāng)后臺(tái)接收到x的數(shù)據(jù)為空，就代表用戶沒(méi)有篩選數(shù)據(jù)，反正則篩選用戶的數(shù)據(jù)

回復(fù) 2017-05-22
慕粉1430088708
可以可以，已經(jīng)用你給的思路解決了，但是不能不通過(guò)js什么的直接用history對(duì)象讀取緩存頁(yè)面解決這個(gè)問(wèn)題嗎？

回復(fù) 2017-05-22