情境描述：
在商品查询列表页向下翻到第N个商品位置→点进去看详情→点击返回，回到列表页→列表停在刚才浏览到的第N个商品的位置。
解决思路：
在跳转到详情页时，记录列表页滚动的距离，详情页返回列表页时，带滚动的参数返回。滚动到相对位置
在我的项目中有点特殊情况：
1.返回列表页时，会刷新页面，重新调用ajax。那么返回时的滚动距离是对的，但是滚动过的列表内容不见了。
针对以上情况，采用如下的解决方案：
1.只要进入详情页（在列表页的getdetail()中），就用window.localStorage.setItem("isDetailBack",“back”); 记录一个标识isDetailBack。
2.在列表页的ajax的回调函数中，（拼接完成列表后。放入content容器之后后后后）就用window.localStorage.setItem("list",“listinfo”);记录放入容器中的所有内容
3.在列表页的ajax的回调函数中，（拼接完成列表后。放入content容器之前前前前）判断只要isDetailBack的值为back。就把本地存储中的list内容放到容器中。然后调用滚动函数，滚动到相应位置。
相关代码：
一、列表页的代码：
//进入详情页函数
function getdata(){
//1.只要调用进入详情页的函数，就在本地存储一下标识
var back = window.localStorage.getItem("isDetailBack"，“back”);
$.ajax({
url:url,
data:{
"userid":userId,
"start":start,
"count":count,
"type":typeReal
},
type:'post',
dataType:'json',
success:function (data){
//相关代码
}
}
二、//加载列表信息函数
function getdata(start,count,type){
$.ajax({
url:url,
data:{
"userid":userId,
"start":start,
"count":count,
"type":typeReal
},
type:'post',
dataType:'json',
success:function (data){
var html = "";
for(var i=0;i<obj.length;i++){
var objStr = JSON.stringify(obj[i]);
html +=
'<p class="undone_list_title">';
html += obj[i].Title+'</p>'+
'<div class="undone_list_info clearfix">'+
'<span class="fl mr20">'+obj[i].doc_type+'</span>'+
'<span class="fl">'+obj[i].AUTHOR_ID+'</span>'+
'<span class="fr">'+obj[i].start_time+'</span>'+
'</div>'+
'</li>';
}
//1.从本地取到back 判断是否进入过详情页，并拼接上历史列表
var back = window.localStorage.getItem("isDetailBack");
//2.进入过详情页，是从详情返回的
if(isDetailBack!=null && isDetailBack== "back"){
//3.获取下面保存在本地的列表信息 见下面的3.1
var html = window.localStorage.getItem("backInfo");
//4.把这部分内容放到content中
$(".content").html(html);//使用html是因为下面保存时，已经把加载更多按钮加载进来了
//5.同时把本地的标识和内容清空，以便下次进入详情使用
window.localStorage.setItem("isDetailBack","");
window.localStorage.setItem("backInfo","");
//6.调用滚动函数 见下面的5.1
backHistory();
}else{
//7.如果不是从详情页返回，就正常的把ajax拼接的html放入容器中
$(".content").before(html);//使用before，是因为有加载更多按钮
}
// 3.1 此时content中已经被放入了内容，保存一下。会随着点击加载更多。重新调用ajax而刷新content的内容。若为返回，直接用此列表数据
window.localStorage.setItem("backInfo",$(".content").html());
}
});
}
//5.1以下为 实现历史返回效果，计算滚动条高度
function backHistory(){
var str = window.location.href;
str = str.substring(str.lastIndexOf("/") + 1);
console.log("取到："+$.cookie(str));//可以实时监听滚动距离
if ($.cookie(str)) {
$("html,body").animate({ scrollTop: $.cookie(str) },0);
}
}
$(window).scroll(function () {
var str = window.location.href;
str = str.substring(str.lastIndexOf("/") + 1);
var top = $(document).scrollTop();
$.cookie(str, top, { path: '/' });
console.log($.cookie(str));
return $.cookie(str);
})
详情页代码：
只需注意：返回时必须配合history.go(-1) 使用-----和滚动函数是匹配的