监听浏览器返回按钮(popstate)

最新推荐文章于 2024-07-08 13:45:00 发布

weixin_34380948

最新推荐文章于 2024-07-08 13:45:00 发布

阅读量6.4k

点赞数 1

文章标签： javascript python ViewUI

原文链接：https://my.oschina.net/u/2489258/blog/3010435

版权

本文介绍了在JavaScript中如何管理浏览器返回按钮的行为，特别是在模态框场景下。主要内容包括：1) 点击返回按钮关闭模态框或返回列表页；2) 页面关闭后销毁监听事件；3) 模态框嵌套时的返回处理。通过设置全局变量跟踪当前模态框状态，以及合理销毁和添加事件监听，确保返回操作符合预期。

摘要由CSDN通过智能技术生成

2019独角兽企业重金招聘Python工程师标准>>>

1.在模态框中控制返回的按钮，点击返回应该关闭模态框

// 设置审批页面的历史记录，用于打开模态框点击返回时关闭模态框
function setHistory() {
  modalInstance.dismiss("cancel");
  window.removeEventListener("popstate", setHistory);
}

//模态窗口打开之后执行的函数
modalInstance.opened.then(function() {
  // 打开模态框需要关闭上一个返回按钮监听事件
  if (typeof(_goBack) != "undefined") {
	  window.removeEventListener("popstate", _goBack);
  }			  
  history.pushState(null, null, document.URL);
  window.addEventListener("popstate",setHistory, false);
});

//点击确定回调函数
modalInstance.result.then(function (retValue) {
  window.removeEventListener("popstate", setHi