可以在不影响历史的情况下使用散列导航吗？

我担心它可能是 不可能，但是有没有办法改变 URL 而不在浏览器的历史中留下记录和 没有重新装弹的散列值？或者做同样的事情？

至于具体细节，我正在开发一些基本的散列导航，大致如下:

//hash nav -- works with js-tabs
var getHash = window.location.hash;
var hashPref = "tab-";
function useHash(newHash) {
//set js-tab according to hash
newHash = newHash.replace('#'+hashPref, '');
$("#tabs li a[href='"+ newHash +"']").click();
}
function setHash(newHash) {
//set hash according to js-tab
window.location.hash = hashPref + newHash;


//THIS IS WHERE I would like to REPLACE the location.hash
//without a history entry


}
// ... a lot of irrelavent tabs js and then....


//make tabs work
$("#tabs.js-tabs a").live("click", function() {
var showMe = $(this).attr("href");
$(showMe).show();
setHash(showMe);
return false;
});
//hash nav on ready .. if hash exists, execute
if ( getHash ){
useHash(getHash);
}

显然是使用 jQuery。其想法是，在这个特殊的情况下1)让用户返回每个标签的变化可以有效地“打破返回按钮”堆积不必要的引用，2)不保留哪个标签，他们是 正在播出，如果他们点击刷新是一种烦恼。

49746 次浏览
小开

Edit: It's been a couple years now, and browsers have evolved.

@Luxiyalu's answer is the way to go

--Old Answer--

I too think it is impossible (at this time). But why do you need to change the hash value if you are not going to use it?

I believe the main reason why we use the hash value as programmers is to let the user bookmark our pages, or to save a state in the browser history. If you don't want to do any of this, then just save the state in a variable, and work from there.

I think that the reason to use a hash is to work with a value that is out of our control. If you don't need it, then it probably means you have everything under your control, so just store the state in a variable and work with it. (I like repeating myself)

I hope this helps you out. Maybe there's an easier solution to your problem.

UPDATE: How about this:

  1. Setup a first hash, and make sure it gets saved in the browser history.
  2. When a new tab gets selected, do window.history.back(1), that will make the history go back from your first init hash.
  3. Now you set the new hash, therefore the tabbing will only make one entry in the history.

You'll probably have to use some flags, to know if the current entry can be "deleted" by going back, or if you just skip the first step. And to make sure, that your loading method for the "hash" doesn't execute, when you force the history.back.

小开 
location.replace("#hash_value_here");

The above seems to do what you're after.

小开

You can always create an event listener to catch click events on the hyperlink and in the callback function put e.preventDefault(), that should prevent the browser from inserting it into the history.

小开
最佳答案

location.replace("#hash_value_here"); worked fine for me until I found that it doesn't work on IOS Chrome. In which case, use:

history.replaceState(undefined, undefined, "#hash_value")

history.replaceState() operates exactly like history.pushState() except that replaceState() modifies the current history entry instead of creating a new one.

Remember to keep the # or the last part of the url will be altered.


提交答案