[thelist] Proper way to append to a links onclick handler

Tomas Kokoska koksa.uh at seznam.cz
Wed Nov 26 12:15:12 CST 2003

You're right. The piece of code I sent you doesn't work in this case (loop,
return value checking etc.).
So, it took me some time, but finally i have something that works (Win2k &&
( IE5.5 || Mozilla1.3))
I´m not sure I am able to explain why, because I still use 0.4.2beta version
of English :-)
but, the code says it itself (I hope):

<script type="text/javascript">
function initializeClicks() {
 if (document.links) {
  for (var i = 0; i < document.links.length; i++) {
   document.links[i].oldClick =
(document.links[i].onclick)?document.links[i].onclick : function() {};
   document.links[i].onclick = function() { return

function doClick() {
 return confirm("doClick called. Do you want to continue?");

I use new property oldClick for each link to store the old onclickHandler
and then assign function doClick() and that oldHandler to onclick.
I've changed function doClick() little bit just to show that you can stop
after this first function if it returns false and continue if it is true.
This function must have a return value, so if you always want to continue
with oldHandler, just add "return true;" at the end of it.
syntax "(doClick()&&this.oldClick())" works (as you probably know) this way:
if (!doClick()) return false; else return this.oldClick(); which is what we

Hope you'll understand and enjoy it.


----- Original Message -----
From: "Roger Ly" <evolt at matchpenalty.com>
To: <thelist at lists.evolt.org>
Sent: Tuesday, November 25, 2003 7:07 PM
Subject: RE: [thelist] Proper way to append to a links onclick handler

> >document.links[i].onclick = function() {document.links[i].onclick;
> >clickFunction;};
> Thanks Tom,
> Unfortunately, that doesn't seem to do the trick for me either.
> I was able to get it to partially work using the technique described on
> PPK's site, but I am still having some issues.
> If you check out http://www.legalanarchy.com/onclick.html you'll see an
> example site.
> The links used to open up the popup windows I had defined with the
> onclick handler I described in my previous post.  Then, I have an onload
> handler which appends to the onclick handler that may or may not exist
> for each link on the page:
> function initializeClicks()
> {
> if (document.links)
> {
> // from PPK's www.quirkmodes.org site
> var oldClick = (document.links[0].onclick) ?
> document.links[0].onclick : function() {};
> // this almost works as I would expect.
> // the original onclick handler for link[0] returns
> false, so it can suppress
> // the following of the href (it was originally designed
> to popup a new window
> // using javascript
> document.links[0].onclick = function() { doClick();
> oldClick(); }
> for (var i = 1; i < document.links.length; i++)
> {
> var oldClickLoop = (document.links[i].onclick) ?
> document.links[i].onclick : function() {};
> document.links[i].onclick = function() {
> doClick(); oldClickLoop();}
> }
> }
> }
> First link:
> <a href="popup.html" target="popup" onclick="alert('blah');return
> false;">links[0]</a>
> In the above code, I have a temporary variable which stores the onclick
> handler of the first link.  Then I create a new anonymous function that
> combines both the new handler, as well as the old one.  Right now, the
> first link performs both handlers, but has a weird side-effect of not
> returning false as defined in the link's original onclick handler.  As
> such, once the doClick() and the alert() get fired, the link continues
> and follows the href and opens a new window (which I don't want it to
> do... keep in mind that the original code had a window.open() command
> instead of the alert() that is there now, so a popup window would have
> already been opened... I don't want another one to open as well).
> Anyways, even if that is handled correctly, the remainder of the links
> which are handled in the for loop don't exhibit the behavior I would
> hope them too.  Namely, each link ends up with the onclick handler
> assigned to the last link in the page.  I assume this is because the
> temp variable I have created within the for loop remains in scope
> throughout the course of the entire for loop, and doesn't get destroyed
> within each iteration of the for loop.  So, in the last iteration, the
> oldClickLoop variable gets assigned the value of the onclick handler of
> the last link, and therefore all the previous links get the onclick
> handler of the last link, instead of their original value.
> One thought would be to store an Array of all the onclick handlers,
> indexed by the index of the actual link on the page, and reassign the
> handlers with the values in the Array, but there has to be any easier
> way, doesn't there?
> Again, any help would be much appreciated.
> Thanks,
> Roger
> --
> * * Please support the community that supports you.  * *
> http://evolt.org/help_support_evolt/
> For unsubscribe and other options, including the Tip Harvester
> and archives of thelist go to: http://lists.evolt.org
> Workers of the Web, evolt !

More information about the thelist mailing list