Disable double click to prevent multiple execution
November 19th, 2010There are still users who double clicks a link or button and web developers sometimes need to do a workaround to avoid the action being triggered twice in a row. (For instance adding an item to a database or downloading a generated file)
All the scripts and workarounds I found on the web for disabling doubleclick was unneccesary complex and disabled the link/button forever after being clicked once, without the possibility to click again unless reloading the page. So I had to dig out something I wrote a long time ago, which disabled double click but only for a short while.
This nasty little javascript disables any link with a single onclick statement, and works fine with ASP.NET controls also by writing OnClientClick=”return disableDoubleClick()” as an attribute. Click on the download link to open the demo.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | <script type="text/javascript"> disableDoubleClick = function() { if (typeof(_linkEnabled)=="undefined") _linkEnabled = true; setTimeout("blockClick()", 100); return _linkEnabled; } blockClick = function() { _linkEnabled = false; setTimeout("_linkEnabled=true", 1000); } </script> Test it here:<br /> <a href="http://shahinalborz.se/wp-content/uploads/2010/11/dummy.zip">Standard download link</a> | <a onclick="return disableDoubleClick()" href="http://shahinalborz.se/wp-content/uploads/2010/11/dummy.zip">Link with disabled doubleclick</a> |
Hi,
I tried testing this code and its not disabling the double click on Firefox and IE can you let me know if this need ASP.NET controls or works fine with any technology.
I’ve tested the script with Firefox 3.6.13 and 3.6.16, Google Chrome 10, Internet Explorer 7, 8 and 9. Which versions have you tested it with?
The script should work independant of server technology, so my guess is you have something which overrides the onclick event of the link tag. Feel free to post a link here and I’ll check it out.