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

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

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

//点击确定回调函数
modalInstance.result.then(function (retValue) {
  window.removeEventListener("popstate", setApprovalHistory);
    if (angular.isFunction(callbackFunc)) {
  	  callbackFunc();
    }
}, function (reason) {//点击取消回调函数
  window.removeEventListener("popstate", setApprovalHistory);
});

2.在基本信息页面中不断的切换tab,点击返回按钮,返回到列表页

function pushHistory() {
   history.pushState(null, null, document.URL);
}
function _goBack() {
    pushHistory();
 window.location.href = document.referrer;
}

// 此部分代码在angularjs的controller中编写
// 延迟执行,避免页面一打开就开始监听
setTimeout(function() {
   pushHistory();
   window.addEventListener("popstate", _goBack, false);
},500);

// 页面销毁事件
$scope.$on('$destroy', function() {
	window.removeEventListener("popstate", _goBack);
});

总结:1.在关闭页面之后需要销毁返回按钮的监听事件。2.如果是打开模态框,在模态框打开的时候销毁上一个页面的监听事件。3.每一个页面都要知道上一个页面的URL,且每一个页面都需要调用监听函数。

/**
 * 最好不要使用document.referrer,因为你从基本信息页面切到列表页的时候,
 * document.referrer记录的是基本信息页面的URL。
 * 所以应该放需要跳转的具体页面的URL,这就需要自己手动构建好URL。
 */
function _goBack() {
  pushHistory();
  window.location.href = document.referrer;
}
02-15 16:00