Loading images using jquery and Ajax

Question

I have an image tag that fires a jquery function using ajax, when clicked, to download images from another source to the server. At the same time when the image is clicked it opens up a new tab and tries to load the image that is being downloaded. How can I make the link not open until the image is finished downloading to the server?

This is the html

<a target="_blank" href="link_to_full_image" \> <img src="link_to_thumbnail" border=0/></a>

Answer 1

Set the link's CSS display property initially to "none" and then after your Ajax response set display to block.

Answer 2

You can use window.open when the ajax-request has finished loading the image. And your onClick-event on the link should have a return false; to stop the html-link from doing what it's supposed to do (open the href in a blank page).

Answer 3

Here is my workaround:

When user clicks the link load the image into the same page but do not show it to user. When ajax request completed with success open the same image adress to download it. Then user can read/download it from cache.