event handling error

[dmjpro]

my HTML code ...

<table border="0" cellpadding="0" cellspacing="0">
<tr>
    <td id=tabbed_TD>Debasis Jana</td>
</tr>
</table>
 

and my JS code ..

function TDClass(){
    this.handle = function(){
        alert(this);
    }
}
 
function test(){
    document.getElementById('tabbed_TD').addEventListener('click',new TDClass().handle,false);
}
 

Now my question is ... inside handle function this says the current clicked TD cell..how? As it supposed to say TDClass object itself.
Please explain..

[Dormilich]

As it supposed to say TDClass object itself.

it’s not, all event listeners (and some other functions like setTimeout, setInterval) change the scope of the current object (this is no bug, but intended).

this behaviour allows you to execute code on a DOM Node without explicitly writing the code to that object beforehand. i.e. it allows you to create re-usable code.

JavaScript Scope @ Digital Web Magazine

if you need to preserve the object’s context, you have to use Closures.

vat tdc = new TDClass();
document.getElementById('tabbed_TD').addEventListener('click', tdc.handle.bind(tdc), false);

Function.prototype.bind = function (obj) {
    var fn = this;
    return function () {
        return fn.apply(obj, arguments);
    }
};

note: standard compliant browsers still pass the event object as first argument to the function.

[dmjpro]

This link is real GEM. Some absurd/typical things just used to go beyond my brain. Those things, exactly those things...context of execution, this in different context and more over apply and call, the clear concept of those hazy things are now clear.

It would be grateful, if you do little more help...

<input type=button value=' Button ' onclick='e_handler(12,34,"debasis jana")' />
 

In the above code e_handler takes 3 inputs, if I register the e_handler through Javascript function then how would I pass those 3 parameters?
Is it possible?

[Dormilich]

you have to use a Closure or a Partial.

[dmjpro]

Ahh! ..so there is no direct way. What you mean by partial??

[Dormilich]

a Partial is related to the Lambda-Calculus (something awfully complicated).

a Partial implementation