Element.bindEventsTo

Posted by & filed under javascript.

War nur gerade mal eine Idee, geschrieben in ca. 5 Minuten, nichts Besonderes aus meiner Sicht…
Mit diesem Codeschnipsel kann man auf ein Element gleichzeitg mehrere Eventhandler setzen.

Die Eventhandler werden als Objekt ├╝bergeben und sollten Funktionen im Stil „onclick“ (‚on’+eventname) usw. enthalten.

Object.extend(Element.prototype,{
    bindEventsTo : function(refObject){
        for(mbrName in refObject){
            if (mbrName.match(/^on(.+)/) && typeof refObject[mbrName] == 'function') {
                this.observe(RegExp.$1, refObject[mbrName].bindAsEventListener(this));
            }
        }
    }
});

Beispiel:

$('input_element').bindEventsTo({
    onclick:function(evt){
        alert(this.id); //Alerts the ID of the element
    },
    onfocus:function(evt){
        alert('focus'); //just alerts "focus"
    }
});

Hab‘ das Skript gerade mal im Firefox 3.0 getestet, aber ich denke, sogar der IE sollte damit ohne weiteres klarkommen.

Leave a Reply