i'm trying changing dinamically the src path of a img tag

i have:

<img src="img1.jpg">

Then i upload new photo by iframe and new photo takes the same name (img1.jpg) then by ajax i refresh the src path (which is the same but photo is changed)

The problem is that i use same file name, img doesn't change in browser, guessing cause of browser cache...

Is there any jquery,html or php solution on this?

thanks

i'm trying changing dinamically the src path of a img tag

i have:

<img src="img1.jpg">

Then i upload new photo by iframe and new photo takes the same name (img1.jpg) then by ajax i refresh the src path (which is the same but photo is changed)

The problem is that i use same file name, img doesn't change in browser, guessing cause of browser cache...

Is there any jquery,html or php solution on this?

thanks

• php
• javascript
• jquery
• html
• src

Share Improve this question Follow asked Sep 2, 2011 at 15:45 Filippo orettiFilippo oretti 49.9k9696 gold badges229229 silver badges351351 bronze badges 5

• 4 You could try appending a random query string to the end... img src="img1.jpg?random_string" – AllisonC Commented Sep 2, 2011 at 15:48
• 1 Try changing the image to something temporary while it is uploaded, and then switch the src back to the img1.jpg. If that doesnt work, consider using a different image name. – Tejs Commented Sep 2, 2011 at 15:48
• 2 @AllisonC your ment should really be an answer instead. – Peter Smith Commented Sep 2, 2011 at 15:49
• 1 stackoverflow./questions/728616/… – InvisibleBacon Commented Sep 2, 2011 at 15:54
• @allison yep Peer is right, your is really an answer and also right answer ;) it works! thx ;) – Filippo oretti Commented Sep 2, 2011 at 15:57

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 4

You could try appending a random query string to the end... img src="img1.jpg?random_string"

You could return the image as a base64 string in the ajax response, and append the data to the img element.

<img src="data:image/jpeg;base64,[STRING GOES HERE]" alt=""/>

This way you will save another request. However, the base64-encoding means a few more bytes are transferred.

Its been cache issue.To resolve this issue use Math.random() as query param

<img src="url_goes_here?Math.random()" />

Another simple way if you don't want to use random as I feel might have a slight performance issue is:-

<img src="url_goes_here?(new Date).(new Date).getMilliseconds()" />