Question

I have a problem with jquery, for example, i have this code:

<a href="#" id="docs"><img id="icon" src="icons/docs.png"/></a>

$("#docs").click(function() {
$("#content").load("docs.php").hide().fadeIn("slow");})

All the things works fine, except that when i reload the website it goes back to the previews situation, but i want the website to still as it is when the link clicked.

Answer 1

You can use the hashtag in the URL to detect this.

First, put your ajax request in a function, and then call this function in two cases: a) when the user clicks on the link; b) if the hashtag is “#load_docs”.

$(document).ready(function() {
    function load_contents() {
        $("#content").load("docs.php").hide().fadeIn("slow");
    }

    $("#docs").click(function() {
        load_contents();
    });

    var hashtag = window.location.hash;
    if (hashtag == "#load_docs") load_contents();

});    

Don’t forget to add href="#load_docs" to your link:

<a href="#load_docs" id="docs"><img id="icon" src="icons/docs.png"/></a>