当用户通过观察 $stateChangeStart
事件单击浏览器 Back
按钮时,我会显示 Javascript Confirm
提示。请考虑以下事项:
用户从第 1、2 页导航,然后是第 3 页。在第 3 页上,用户单击 Back
按钮,他们会看到一个确认框。用户点击 Cancel
按钮,执行 event.preventDefault()
并且用户停留在同一页面上。然后,如果用户再次单击 Back
,并第二次选择 OK
,用户将返回到页面 1。页面 2 发生了什么? event.preventDefault()
是否删除了最后的历史记录?如何防止浏览器跳过上一页?
$rootScope.$on('$stateChangeStart',
function (event, toState, toParams, fromState, fromParams) {
var retVal = confirm("You have unsaved changes. If you leave the page, these changes will be lost.");
if (retVal == false) {
// user wants to cancel navigating back.
event.preventDefault();
}
});
最佳答案
如果您想在防止点击后退按钮的同时保留历史记录,您必须观察 $locationChangeStart 事件而不是 $stateChangeStart。
这是因为与 $locationChangeStart 相比,$stateChangeStart 是在执行转换并且浏览器历史记录已更新后进行广播。
所以它应该是这样的:
$rootScope.$on('$locationChangeStart', function(event, next) {
var retVal = confirm("You have unsaved changes. If you leave the page, these changes will be lost.");
if (retVal == false) {
// user wants to cancel navigating back.
event.preventDefault();
}
});
关于javascript - 使用 Angularjs 和 UI Router 的 event.preventDefault() 删除浏览器历史记录,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35484466/