JSFiddle - React, Tailwind, and code Playground
HTML
<a id="doit" href="#">Start</a>
JavaScript
var use_unique_name = true;
var cancelSrc = 'data:image/gif;base64,R0lGODlhEAAOALMAAOazToeHh0tLS/7LZv/0jvb29t/f3//Ub//ge8WSLf/rhf/3kdbW1mxsbP//mf///yH5BAAAAAAALAAAAAAQAA4AAARe8L1Ekyky67QZ1hLnjM5UUde0ECwLJoExKcppV0aCcGCmTIHEIUEqjgaORCMxIC6e0CcguWw6aFjsVMkkIr7g77ZKPJjPZqIyd7sJAgVGoEGv2xsBxqNgYPj/gAwXEQA7';
var imgsrc = 'http://www.whodah.com/Misc/earth-map-huge.jpg';
imgsrc = 'http://www.jaavuu.com/content/1/slides/jaavuu-one-event-one-gallery.jpg';
if (use_unique_name) {
var ts = +(new Date());
// try replacing _= if it is there
var ret = imgsrc.replace(/(\?|&)_=.*?(&|$)/, "$1_=" + ts + "$2");
// if nothing was replaced, add timestamp to the end
imgsrc = imgsrc + ((ret == imgsrc) ? (imgsrc.match(/\?/) ? "&" : "?") + "_=" + ts : "");
}
$('#doit').click(function() {
$('#doit').remove();
// I really should use an empty html file, but I don't have one, so robots.txt will do...
var ifr = $('<iframe />');
$('body').append(ifr);
ifr.load(function() {
var cd = ifr.contents();
$(cd).find('body').append('<img id="imgloader" />');
var im1 = $(cd).find('#imgloader');
im1[0].onload = function() {
$('body').append('<img src="' + imgsrc + '" />');
};
im1.attr('src', imgsrc);
setTimeout(function() {
var cd = ifr.contents();
var im1 = $(cd).find('#imgloader');
im1[0].onload = null;
//im1[0].src = '/robots.txt';
im1.remove();
ifr.remove();
}, 1000);
});
return false;
});