Question

从文档（http://www.asual.com/jquery/address/docs/）中可以看出，该插件有一个事件来检测浏览器的后退/前进按钮何时被按下。

$。address.externalChange（FN）

我的问题是，是否有办法知道何时按下背部以及何时按下前进部分。例如，这将适用于两种情况：

$.address.externalChange(function() { console.log('back/forward pressed'); });

感谢。

Answer 1

据我所知，没有历史插件可以检测到哪个浏览器按钮完全按下了。

您可以做的最好的事情是保留已访问页面的历史记录，然后检查历史记录中的新页面是否比当前页面更远。当没有后退/前进按钮重新访问页面时，您可能会在下面的代码中得到错误的结果。

未经测试的示例代码：

var visitedPages = [$.address.path()];
var currentPage = $.address.path();

$.address.internalChange(function() {
   visitedPages.push($.address.path());
});

$.address.externalChange(function() {
   var newPage = $.address.path();
   var currentPageIndex = -1;
   var newPageIndex = -1;

   for (var i = 0; i < visitedPages.length; i++) {
      if (visitedPages[i] == currentPage) currentPageIndex = i;
      if (visitedPages[i] == newPage) newPageIndex = i;
   } 

   if (newPageIndex == -1 || currentPageIndex == -1) {
      console.log("unkown button pressed");
   } else {
      if (newPageIndex > currentPageIndex) {
          console.log('forward pressed'); 
      } else
      if (newPageIndex < currentPageIndex) {
          console.log('back pressed'); 
      } else {
          console.log('page reloaded?');
      }
   }
});

Answer 2

我终于想通了。这段代码适用于普通页面导航，我在其中导航：Page1，Page2，Page3等。在这些情况下，代码可以识别后退和前进。

var visitedPages = [$.address.path()];
var first_load = true;

$.address.internalChange(function() {

   visitedPages.push($.address.path());

});

$.address.externalChange(function() {

    var newPage = $.address.path();

    if (visitedPages[visitedPages.length-2] == newPage) {

        console.log('back');
        visitedPages.splice(visitedPages.length-1 , 1);

    } else if (first_load === false) {

        console.log('forward');     
        visitedPages.push($.address.path());

    }

    first_load = false;

});

区分jquery地址插件中的后退/前进

2 个答案: