[TAG] 2 cent tip - making sure a link is only clicked once

Tue Apr 27 00:33:52 MSD 2004

When a web site is responding slowly, frustrated users may press a link 
repeatedly. This may exacerbate the situation by making your web server 
repeatedly serve a page unnecessarily. For some links it may result in more 
severe consequences, such as submitting multiple orders, where a customer 
only wants one.

On javascript enabled browsers, it is quite easy to either disable the link, 
or display a "please wait" message. By including the "please wait" message  
as a hidden "div" within a page, this is not dependent on the server response 
time.

The example below is only tested on Mozilla 1.4 and may need some work to be 
truly cross-platform, standards compliant, etc. It contains 2 <DIV> tags 
called MAIN and WAIT. The onload attribute is used to hide the WAIT div, 
until the link is clicked, at which point the MAIN div is hidden and the WAIT 
div displayed. If the website in the link responds quickly, you may not see 
the "please wait" message at all.

<HTML>
  <HEAD>
    <TITLE>Press once</TITLE>
    <SCRIPT type="text/javascript">
      function wait( waitFlag )
      {
        if( waitFlag )
        {
          document.getElementById('MAIN').style.display="none";
          document.getElementById('WAIT').style.display="block";
        }
        else
        {
          document.getElementById('MAIN').style.display="block";
          document.getElementById('WAIT').style.display="none";
        }
        return true;
      }
    </SCRIPT>
  </HEAD>
  <BODY ONLOAD="wait(false);">
    <DIV ID="MAIN">
      To test please <A HREF="http://www.alacut.com/page4.htm" ONCLICK="return 
wait(true);">Click here</A>.
    </DIV>
    <DIV ID="WAIT">
      <P>
        You have clicked on the link. Please wait while we load the next page.
      </P>
    </DIV>
  </BODY>
</HTML>