html js清除历史,javascript – JS – window.history – 删除一个状态

你现在可能已经移动了,但据我所知,没有办法删除历史记录(或状态).

我一直在研究的一个选择是自己在JavaScript中处理历史,并使用window.history对象作为载体.

基本上,当页面首次加载时,您将创建自定义历史记录对象(我们将在此处使用数组,但是使用任何对您的情况有意义),然后执行初始的pushState.我将传递您的自定义历史记录对象作为状态对象,因为它可能会派上用场,如果你还需要处理用户远离你的应用程序,然后回来.

var myHistory = [];

function pageLoad() {

window.history.pushState(myHistory, "", "");

//Load page data.

}

现在,当您导航时,您可以添加到自己的历史记录对象(或者不要 – 您的手中的历史记录！),并使用replaceState来保持浏览器不在循环中.

function nav_to_details() {

myHistory.push("page_im_on_now");

window.history.replaceState(myHistory, "", "");

//Load page data.

}

当用户向后导航时,它们将触发您的“基本”状态(您的状态对象将为空),您可以根据自定义历史记录对象来处理导航.之后,你做另一个pushState.

function on_popState() {

// Note that some browsers fire popState on initial load,

// so you should check your state object and handle things accordingly.

// (I did not do that in these examples!)

if (myHistory.length > 0) {

var pg = myHistory.pop();

window.history.pushState(myHistory, "", "");

//Load page data for "pg".

} else {

//No "history" - let them exit or keep them in the app.

}

}

用户永远无法使用浏览器按钮向前导航,因为它们始终位于最新的页面上.

从浏览器的角度来看,每当他们“回来”时,他们会立即再次向前推进.

从用户的角度来看,他们能够向后浏览页面但不能向前(基本上模拟智能手机“页面堆栈”模型).

从开发人员的角度来看,您现在可以高度控制用户如何浏览应用程序,同时仍允许他们在浏览器上使用熟悉的导航按钮.您可以随时从历史链中的任何地方添加/删除项目.如果您使用历史数组中的对象,您还可以跟踪有关页面的额外信息(如字段内容和whatnot).

您还可以扩展想法来处理向前导航.您将需要3页 – “后退”处理程序页面,“转发”处理程序页面和用户通常在其之间的“休息”页面.然后,您需要沿着历史对象来回移动,而不是简单地按/弹出项目.