問題描述：頁面刷新滾動條不返回到最初到位置而是返回之前瀏覽的位置
要點：通過sessionStorage設置獲取刷新頁面前的滾動條位置
<div id="outterBox" style="width:100%;height:100%;background:yellow;overflow: auto">
<div id="innerBox" style="background:red">aaaa</div>
</div>
innerBox的高度由內容撐開且通過后端接口獲取數據
...
//
let scrollToTop = Number(window.sessionStorage.getItem('top'))
...
getRebuildDataResultService(updateId, centerId).then(resp => {
if (resp.errorcode == 100) {
let respLog = resp.data && resp.data[0] && resp.data[0].log
// respLog = respLog.join('<br/>')
logs += '<div style="font-size:14px;font-weight:normal;">'
logs += respLog
logs += '</div>'
let dom = document.getElementById('outterBox')
dom.innerHTML = logs
setTimeout(() => {
dom.scrollTop = scrollToTop || 0
}, 0)
}
})
...
//dom元素滾動時，保存滾動條位置到緩存
function setScrollY (e) {
let top = dom.scrollTop || 0
window.sessionStorage.setItem('top', top)
}
let dom = document.getElementById('outterBox')
dom.addEventListener('scroll', setScrollY)
使用
$(window).load(function () {
// let dom = document.getElementById('outterBox')
// let scrollToTop = window.sessionStorage.getItem('top')
// if (scrollToTop) {
// dom.scrollTop = Number(scrollToTop)
// }
// })
時無法將滾動條高度賦值給dom元素？？
存在問題：當頁面加載后，innerBox中的數據還沒從后端返回，無法獲取到innerBox的高度（設置scrollTop前提必須是存在滾動條）
解決辦法：
setTimeout(() => {
dom.scrollTop = scrollToTop || 0
}, 0)
}
使用setTimeout在后端數據返回，並寫入dom中后，設置scrollTop值