Question

I have this event handler:

//Event Handler
var bindEvt = (function () {
    "use strict";
    if (document.addEventListener) {
        return function (element, event, handler) {
            element.addEventListener(event, handler, false);
        };
    }
    return function (element, event, handler) {
        element.attachEvent('on' + event, handler);
    };
}());

And this code which cycles trough menu elements and detects if one is clicked.

// Ajax article loading
function test(){var menuitem = document.getElementsByTagName('nav')[0].childNodes;
    for(var i= 0; i < menuitem.length; i++){
        bindEvt(menuitem[i], "click", loadajax);
    }
};

function loadajax () {
    alert('yo')
}
bindEvt(window, "load", test);

Now my problem is that I would like loadajax() to know what item was clicked but I cannot seem to figure out how to pass an argument from test() to loadajax().

How would I do this? I tried a couple of things but it always seems to break the script 🙁

Thanks for your feedback!

Answer 1

If all you’re trying to do is to know which object was clicked, then you can use the value of this in your event handler. You don’t have to pass that to loadajax. The event system will set this to the object that caused the event. You can also reference event.target.

function loadajax (event) {
    event = event || window.event;   // deal with old IE

    // `this` points to the object that caused the event

    alert('yo');
}