Question

I am currently making a temporary download page for website visitor.

The page includes a form, after the visitor fills the form up, the site will take them to the pdf download page.

In the download page, there are some pdf files download links (I am just using a tag.). However, i wanna make a onclick event to those links, once they have been clicked, the page will refresh automatically or redirect to other pages.

<a href="/file.pdf" onClick="window.location.reload()">The File</a>

I have tried the jquery way as well.

<a href="/file.pdf" id="FileDownload">The File</a>
<script>
   $("#FileDownload").click(function(){
         location.reload();
   });
</script>

But all the them are not working. Do you masters have any good ideas about this, many thanks.

P.S. What if I wanna add a countdown after a file is being started download, and then do page reload when countdown finishes.

Looks like have asked several questions… Thanks a ton in advance.

Answer 1

This works:

http://jsbin.com/imikit/5

The timeout must be set to more than the response time of the server serving the file, otherwise the javascript won’t fire. So set it to something high.

<a href="http://ipv4.download.thinkbroadband.com/1GB.zip" id="download">The File</a>

$('#download').click(function() {
  setTimeout(function() {
    window.location = 'http://www.google.com/';
  }, 1000);
});

Or

<a href="http://ipv4.download.thinkbroadband.com/1GB.zip" id="download" target="_blank">The File</a>

$('#download').click(function() {
  window.location = 'http://www.google.com/';
});

Most browsers will close the newly opened window once the download has initiated.

---

Lighttpd 2’s mod_upload might be worth looking at. Unfortunately there’s no stable version of Lighttpd 2 yet.

---

You could try sending a cookie along with the download, then detecting it with javascript. This will either be set after the headers are sent, or after the body is sent. (test it)