Question

I’ve got a site which uses jQuery and Ajax to change the site content without reloading the page. The site contains content which I often change. But somehow the page gets saved in the cache so it doesnt show the changes.

I tried several things to make the browser not to save the site into the cache like METAs and PHP. But it doesnt work.

I think it has to do with the fact, that the page always has the same URL so I thought about adding a random number to it like:

window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5);

(It’s not my code, found it with some googlin) But this only adds the link ID I clicked on to the URL. I don’t know where to put “Math.random()” to add a random number.

Hope you can help!

Answer 1

Just use cache : false. jQuery will automatically add a timestamp to the end of the URL for you, making sure that ajax requests are never cached.

Quoting the the API reference for .ajax()

cache
Default: true, false for dataType ‘script’ and ‘jsonp’

If set to false, it will force requested pages not to be cached by the browser. Setting cache to false also appends a query string parameter, “_=[TIMESTAMP]”, to the URL.

Examples

1. Globally disable caching for all future ajax requests. See .ajaxSetup()

   $.ajaxSetup({
     cache: false
   });
   

2. Disable caching per request. See .ajax()

   $.ajax({
     url: "test.html",
     cache: false,
     success: function(html){
       $("#results").append(html);
     }
   });