I am currently struggling with good website navigation using Ajax calls and unobtrusive JS. I catch the click event on the links, load the content, attach it to the div and then return false. This works pretty well, and also allows Google to crawl the site using voice URLs.
But I did not know how to handle the back button. I found this solution to catch an event when the user clicks the back button:
http://www.bajb.net/2010/02/browser-back-button-detection/
It works very well. But I also want the "Back" button to work fine when the user finds the site via the link and wants to return to the previous page (I do not want to catch anyone).
When I thought about this, the best way would be to use anchors. The regular return button supports them, and you can return to the story without reloading the page (/ # 1 <- / # 2 <- / # 3, etc.)
It will work as follows:
- Use regular URLs in the link, but understand the click event
- When the user clicks, downloads the content and attaches it to the DIV
- Change window.location using the binding (for example, "domain.com/#products/women-clothing" with the window .location = "# products / women-clothing";)
- When the window window.location changes, get the binding, read the path and get the contents via ajax, attach it to the DIV
Only the last part is not entirely clear to me, and I may need help here.
Finally, my question is: does this make sense?
Thank!