history解决ajax涌现的题目--百分百源码网

history解决ajax涌现的题目-

发布时间：08/01 来源：未知浏览：关键词：

前言：此刻先后端根本都是通过ajax实现先后端接口数据的交互，但是，ajax有个小小的劣势，即：不支撑阅读器“后退”和“前进“键。但是，此刻我们可以通过H5的histroy属性解决ajax在交互要求的这个小bug。事件描述：H5添加了一个事件window.onpopstate，当会员点击那两个按钮就会触发这个事件。但是光检测到这个事件是不 下列内容是对于Jquery.history解决ajax的前进后退题目，概括详情请看下文。

本文的条件是基于后台的，所以这里不会考虑搜索引擎优化的题目。同时，基于后台的治理系统，也不需要被珍藏，所以也不会考虑刷新的这品种似直接敲网址的状况！！！

事件描述：

H5添加了一个事件window.onpopstate，当会员点击那两个按钮就会触发这个事件。但是光检测到这个事件是不足的，还得能够传些参数，也就是说返回到以前阿谁页面的时候得晓得阿谁页面的pageIndex。通过 history的pushState办法可以做到，pushState(pageIndex)将目前页的pageIndex存起来，再返回到这个页面时猎取到这个pageIndex。

window.history.pushState描述：

window.history.pushState(state, title, url);

state对象：是一个JavaScript对象，它关系到由pushState()办法新建出来的新的history实体。用以存储对于你所要插入到历史记载的条款的相干信息。State对象可以是任何Json字符串。由于firefox会运用会员的硬盘来存取state对象，这个对象的最大存储空间为640k。要是大于这个数值，则pushState()办法会抛出一个异样。

title：firefox此刻回忽略这个参数，虽然它可能未来会被运用上。而此刻最平安的运用方式是传一个空字符串，以防止未来的修改。

url：用来通报新的history实体的URL，阅读器将不会在调取pushState()办法后加载这个URL。或许会过一会尝试加载这个URL。比方在会员重新启动了阅读器后，新的url可以不是绝对途径。要是是相对途径，那么它会相关于现有的url。新的url必需和现有的url同域，不然pushState()将抛出异样。这个参数是选填的，要是为空，则会被置为document目前的url。

直接贴代码：

         (      loadData=         pageIndex:window.history.state===?1                  init:             .getData(                       getData:              that=                  type:'post'                 url:'./data/getMovices'+pageIndex+'.json'                 dataType:'json'                 async:                 success:             renderDom:              bookHtml=                 ""+                 ""+                 ">"+                 ""+                 ""+                 ""             ( i=0;i" + movies[i].moviesName + "" +                     "   " +                     "   " +                     ""              bookHtml+="电影 导演 上映工夫
" + movies[i].moviesEditor + " " + movies[i].times + "
"             bookHtml +=                 "" +                 ""             $('body'          nextPage:              that=             $(document).on("click",".nextPage",                 that.pageIndex++                  window.history.pushState({page:that.pageIndex},                          window.addEventListener("popstate",          page=0         (event.state!==             page=             console.log('page:'+          console.log('page:'+          loadData.pageIndex=   })(jQuery,window,undefined);