addEventListener in custom object

Printable View

04-05-2012, 10:24 AM
raphael75

addEventListener in custom object

I'm trying to understand how a custom object can call a function within itself. Say I have something like this:

Code:

function functiontest() { this.prop1 = '', this.prop2 = '', this.options = {initiallevels:0}, this.prop3 = '/blah', this.prop4 = true, this.function4 = function(x) { console.log(x) }, this.init = function(options) { this.uid=options.uid this.t=options.target gebid(this.t).addEventListener('click',function(){this.uid.function4(this.t)},false) } } myfun1=new functiontest myfun1.init({uid:'myfun1',target:'target1'}) myfun2=new functiontest myfun2.init({uid:'myfun2',target:'target2'})

And the html:

Code:

<html> <head></head> <body> <div id="target1">T1</div> <br> <div id="target2">T2</div> </body> </html>

I don't know what to put in the part in bold to set the click event listener and have it call function4 within the functiontest object. I've tried a bunch of different things and nothing worked. Please help, thanks!
04-05-2012, 12:05 PM
raphael75

I could do something like:

Quote:

document.getElementById(this.t).addEventListener('click',function(evt){var tmp=new functiontest();tmp.function4(this.t)},false)

and that works, but there's got to be a better way to do it. Any help is appreciated, thanks!
04-07-2012, 11:44 PM
raphael75

Any ideas?
04-08-2012, 12:24 AM
Troy III

I'm sure I don't understand what you are trying to do at all
but in case that you are asking if it's possible to add event listeners to native JS objects -I'll have to say "not".
Only DOM elements can.

What is your primary goal?
04-08-2012, 02:07 AM
Jeff Mott

I think the problem is that the value of "this" will vary depending on the context of the function being executed. In the case of a listener, "this" will be the event's target, which in this case will be a DIV element.

What you'll need to do is, outside of the listener callback, save the value of "this" in another variable.

Code:

var that = this; gebid(this.t).addEventListener('click', function () { that.uid.function4(that.t); }, false);

Once you get past that hurdle, you're likely to run into another problem with this line:

Code:

that.uid.function4()

The method "function4" belongs to the that/this object, not to the uid property.