Jquery load in image dynamically

Question

When my page loads I have an empty image, after a user inputs the correct query string I parse it and return the id/location of the image using AJAX.

<a class="bigImg rght" style="width:258px;">
<img src="" alt="Slide" width="298" height="224" /></a>

Then I append the new id's into the img src field, but what it is not doing is loading the new image in.

parent_img.attr("src","http://www.mysite.com/files/"
+(data.offset_num)+"/"+(data.offset_id)).fadeIn(1000);

So now my html looks like this:

<a class="bigImg rght" style="width:258px;">
<img src="http://www.mysite.com/files/4823413/008234" alt="Slide" width="298" height="224" /></a>

which is the correct location, but it's not refreshing the image, how can I force it to do so? so the new image is loaded in.

the URL is correct I just changed it to not use the actual url of my site. — Edward
– Edward, Commented Jan 28, 2013 at 21:49

Chris Brickhouse · Accepted Answer · 2013-01-28 21:51:55Z

1

I worked around this by tacking a random ID onto the end of the image.

var img_src = '/images/path_to_image.jpg?' + new Date().getTime();
$('#img_id').attr('src', img_src);

answered Jan 28, 2013 at 21:51

Chris Brickhouse

6485 silver badges15 bronze badges

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

2 Comments

Jean-Georges Over a year ago

This will force the browser to reload the image everytime. Have you tried creating your image element with jquery and then adding it to your document ?

Chris Brickhouse Over a year ago

he wants the image to refresh every time, so this will do what he wants. his image tag exists, with no src. by setting the src the way i have posted, it would change it and load the image correctly.

Collectives™ on Stack Overflow

Jquery load in image dynamically

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related