Question

假设我的html是

<a href="#one">One</a>
<a href="#two">Two</a>

和Js是

$(window).on("hashchange"){
alert(document.location.hash);
}

我想获取哈希值更改之前的哈希值。是否可能？如果是，如何？

Answer 1

使用

$(window).on("hashchange", function(e){
    console.log(e.originalEvent.oldURL)
    console.log(e.originalEvent.newURL)
});

演示：http://jsbin.com/ulumil/

Answer 2

您必须跟踪最后一个哈希值，例如：

var currentHash = function() {
  return location.hash.replace(/^#/, '')
}

var last_hash
var hash = currentHash()

$(window).bind('hashchange', function(event){
  last_hash = hash
  hash = currentHash()
  console.log('hash changed from ' + last_hash + ' to ' + hash)
});

Answer 3

实际上Amit提供的解决方案可以工作，但也可以使用jquery库和跨平台。

这是使用核心javascript和crossbrowser的更简化的解决方案。（查看最新版本的IE / FF / Chrome / Safari）

window.onhashchange = function(e){
  console.log(e);
  var oldURL = e.oldURL; 
  var newURL = e.newURL; 
  console.log("old url = " + oldURL);
  console.log("new url = " + newURL);
  var oldHash = oldURL.split("#")[1];
  var newHash = newURL.split("#")[1];
  console.log(oldHash);
  console.log(newHash);
};

Answer 4

不要使用

$(window).on("hashchange", function(e){
    console.log(e.originalEvent.oldURL)
    console.log(e.originalEvent.newURL)
});

它不会在IE上工作，也可能在其他地方工作。

使用它。

(function(w, $){
  var UrlHashMonitor = {};
  UrlHashMonitor.oldHash = '';
  UrlHashMonitor.newHash = '';
  UrlHashMonitor.oldHref = '';
  UrlHashMonitor.newHref = '';
  UrlHashMonitor.onHashChange = function(f){
    $(window).on('hashchange', function(e){
      UrlHashMonitor.oldHash = UrlHashMonitor.newHash;
      UrlHashMonitor.newHash = w.location.hash;
      UrlHashMonitor.oldHref = UrlHashMonitor.newHref;
      UrlHashMonitor.newHref = w.location.href;
      f(e);
    });
  };
  UrlHashMonitor.init = function(){
    UrlHashMonitor.oldHash = UrlHashMonitor.newHash =   w.location.hash;
    UrlHashMonitor.oldHref = UrlHashMonitor.newHref = w.location.href;
  };
  w.UrlHashMonitor = UrlHashMonitor;
  return UrlHashMonitor;

})(window, window.jQuery);

/*
 * USAGE EXAMPLE
 */
UrlHashMonitor.init();
UrlHashMonitor.onHashChange(function(){
  console.log('oldHash: ' + UrlHashMonitor.oldHash);
  console.log('newHash: ' + UrlHashMonitor.newHash);
  console.log('oldHref: ' + UrlHashMonitor.oldHref);
  console.log('newHref: ' + UrlHashMonitor.newHref);
  //do other stuff
});

这适用于所有现代浏览器。

DEMO：https://output.jsbin.com/qafupu#one

获取hashchange之前的哈希值

4 个答案: