jQuery Script caching on localhost

Question

I have an ASP.NET 3.5 web application written in VS 2010. I have an aspx with a script reference to a .js file that resides in a Scripts folder.

<script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script src="Scripts/HeaderControl.js" type="text/javascript"></script>

Within the .js file I'm using jQuery to do some various operations, one of which was simply a debugging statement that used alert to spit out a value on the page so I could see what it was.

if ($) {
    $(document).ready(function () {
        $("input[id='q']").click(function($e) {
            alert("clicked");
        });
    });
}

This all worked great until I went to remove the debug statement (the alert "clicked"). Upon completely removing it from the .js, I rebuilt the project, hit F5 to run it on my localmachine, but as soon as I clicked upon the input tag above the alert still popped up and said "clicked". I tried one thing after another trying to get the web app to realize that the .js had been changed, but it kept displaying the alert every time that I'd click on the input tag. I finally decided to rename the .js to something completely different, at which time the web app realized that the .js had been changed and it quit displaying the alert when I'd click upon the input tag.

So why was this .js file being cached? It's a very annoying behavior and I'd love to know what exactly was causing it. Any help would be appreciated. Thanks!

EDIT: Browser was IE7. I didn't check to see if it did it in Mozilla as well. Regardless, I've done at least a 100 different .js files and I've never noticed this behavior before. The only difference for me is that this .js is in a web app, whereas usually I'm creating them in ASP.NET web site projects.

Which browser are you using, what other add-ons have you go installed, have you tried clearing cache, did you try a hard refresh? — jcolebrand
– jcolebrand, Commented Dec 2, 2010 at 17:24
If I recall correctly, you can hit Ctrl+F5 in IE to force your cache to refresh. Give it a shot. — RabidFire
– RabidFire, Commented Dec 2, 2010 at 17:24
@RabidFire ~ Congratulations on recalling correctly, but it works that way on all browsers. However, using something like CCleaner may be faster, as it will clear all caches simultaneously (and usually faster than the APIs) — jcolebrand
– jcolebrand, Commented Dec 2, 2010 at 17:26

Nicole · Accepted Answer · 2010-12-02 17:44:47Z

3

You need to Shift + Refresh, or, just clear your browser's cache.

This is normal behavior:

Javascript and CSS files do not even check for a new version (an If-Modified-Since request) if the old version is still valid according to the cache headers in the response sent the first time.

I believe that if you put in any query string, even just ?, at the end of the url (i.e., Scripts/jquery-1.4.1.min.js?) some browsers (Firefox at least) will change to check for a new version of the file every time like it will for images. This could be useful during development.

Some developers will also append a version to the file (?123) so that they can cause the browser to ignore the cache completely when a new version of a web app is released. I'm not sure how effective this is if you already have a question mark at the end, since it will be looking for an updated version anyway (again, not sure about all browsers).

edited Dec 2, 2010 at 17:44

answered Dec 2, 2010 at 17:26

Nicole

33.3k11 gold badges78 silver badges102 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

jcolebrand Over a year ago

+1 on referring to the appropriate header so the asker learns more about HTTP requests...

Collectives™ on Stack Overflow

jQuery Script caching on localhost

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related