场景:一个页面如果通过ajax请求加载数据时,如果跳转到下一页面再回来,这时候数据会消失,需要再次通过ajax请求拿到。
目标:返回上一页时,上一页ajax请求的数据还在。
解决方案:
1.cookie,通过cookie的方式保存数据,每次打开页面时需判断cookie中的数据是否存在,然后加载。
个人不推荐这种方式,因为cookie保存的数据大小有限制,而且这个cookie不管是以什么方式跳转该页面都会取到同一cookie。
2.不知道各位发现没有,input框里面的值在界面跳转时会保留下来(好像只限于type=text的情况),而且只有在界面回退时input框才会显示之前的值。知道这个后就能做很多事了。
(1)我们可以先弄一个隐藏域,然后把input框放进去
(2)通过ajax请求的数据都用一个js对象或数组保存下来,界面跳转时放到input里面,这里推荐把数据用json的格式存储,取的时候直接把json转成对象就好了。
(3)加载页面时,判断隐藏域中的input框是否有值,如果有值,把值处理后放到界面上展示并同样把数据用js对象保留下来(因为可能下次跳转还会用到);没有值,就按照新跳转到该界面的情况处理。
注意:微信打开网页时的处理略有不同,需要在界面跳转时加上延时函数。因为界面跳转时,有可能数据还没放到input里面就已经跳转界面了,导致input里面并没有保存数据