javascript – 如何实现后退功能,如浏览器

前端之家收集整理的这篇文章主要介绍了javascript – 如何实现后退功能,如浏览器前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我想像浏览器那样在我的项目中实现像前后一样的功能,就像我们有屏幕的网页一样.
我试过的是
设置currentscreenindex = -1

并且当第一屏幕的数据来执行该功能

In screen data arrive function (){
   this.currentscreenindex++; 
   this.screenvisited[this.currentscreenindex]=data;

}

这是我的背功能我试过的:

back(){
    currentscreenindex--;
    var screen=screenvisited[currentscreenindex];
    // will go to this screen
}

但是我的问题在于:

currentscreenindex  screen data in screenvisted array
When 1st screen arrived     0     Data of 1st screen 
When 2st screen arrived     1     Data of 2st screen 
When 3st screen arrived     2     Data of 3st screen 
When 4st screen arrived     3     Data of 4st screen 
When 5st screen arrived     4     Data of 5st screen 
when user click back button 3     call the screen is set to 4th gib,

所以当第4个屏幕的数据到达时,当前索引会增加,所以currentindex = 4,当前索引4的数据将是第4个屏幕,我认为这是不正确的,因为如果currentindex = 4的数据会被改变,那么我可以如果有,请告诉我如何纠正?

请建议我如何编写正确的后退功能来完成与浏览器相同的功能.

解决方法

我不知道你如何适应现在这样做,但你可以实现这样的功能

你有两个堆栈.后堆栈和下一个堆栈.他们都开始是空的.当用户通过链接导航到新页面或除了后退/转发之外的其他导航方法时,清除下一个堆栈,将当前页面添加到后端堆栈,然后继续导航.当用户点击后,将当前页面推送到正向堆栈,从后面的堆栈中弹出一个页面,并导航到弹出的页面.当用户点击前进时,将当前页面推到后面的堆栈上,从前面的堆栈中弹出一个页面,并导航到弹出的页面.

编辑:你问了一些伪代码,所以这里你去:

var currentPage=null;
var backStack=[];
var forwardStack=[];
function navigate(newPage) {
    currentPage=newPage;
    // stub
}
function linkClicked(page) {
    backStack.push(currentPage);
    forwardStack=[];
    navigate(page);
}
function goBack() {
    forwardStack.push(currentPage);
    navigate(backStack.pop());
}
function goForward() {
    backStack.push(currentPage);
    navigate(forwardStack.pop());
}

猜你在找的JavaScript相关文章