History.go（-1）不适用于具有指向同一页面部分的链接的页面

Question

I am facing a problem. I have a web page where I use back button anchor link and the code used is ONCLICK="history.go(-1)" . The same page has many anchor links and the related sections.

When I go to a page containing back button and click back button immediately, then back button works fine.

If I go to a page containing back button, then hit anchor link that points to a section in the same page and then hit the back button, then it never goes to previous web page, instead goes to the section url.

Answer 1

Through the new History API, you can manipulate the browser history .

History.js helps you achieve this in a cross-browser way.

I have quickly created a small fiddle that illustrates it working and uses jQuery for event handling (this is not production code, just a demo, works in my Chrome).

$('.anchor').click(function () {
    history.replaceState({}, '', this.href);
});

Answer 2

If so you could use javascript to solve this by simply using this line.

Make use of the history.go() JavaScript function as below:

<a href="javascript:window.history.go(-1);">Go back</a>

Answer 3

Maybe you can try a counter that counts how many times a "section" link is clicked

Maybe something like (with jQuery but maybe some kind person will go and change this code to nice plain JavaScript):

var count = 0;
var historyValue = -1;
$(".sectionlinks").click(function () {
    ++count;
    window.historyValue = -(count + 1);
})​

And all your section links have a sectionlinks class.

Then you can do on your back link:

<a onclick="history.go(historyValue)">My Back Link</a>

See this fiddle for a demo: http://jsfiddle.net/RRcyF/2/