Alex Rivera | Logout

JavaScript: Adding an onClick handler without overwriting the existing one

Asked 2009-05-21T09:01:46.863
21

I'm trying to modify all links on a page so they perform some additional work when they are clicked.

A trivial approach might be something like this:

function adaptLinks()
{
    var links = document.getElementsByTagName('a');
    for(i = 0; i != links.length; i++)
    {
        links[i].onclick = function (e)
        {
            <do some work>
            return true;
        }
    }
}

But some of the links already have an onClick handler that should be preserved. I tried the following:

function adaptLinks()
{
    var links = document.getElementsByTagName('a');
    for(i = 0; i != links.length; i++)
    {
        var oldOnClick = links[i].onclick;
        links[i].onclick = function (e)
        {
            if(oldOnClick != null && !oldOnClick())
            {
                return false;
            }
            <do some work>
            return true;
        }
    }
}

But this doesn't work because oldOnClick is only evaluated when the handler is called (it contains the value of the last link as this point).

Edit
Report

1 Answer

0

I had problems with overloading in the simple way - this page was a great resource http://www.quirksmode.org/js/events_advanced.html

answered 2010-01-08T03:20:11.917

Your Answer