469,323 Members | 1,551 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,323 developers. It's quick & easy.

problem with "this" and context

I am having a problem with the use of "this". Maybe someone can help
me out here, let me know if I am doing this wrong:
Lets say I have an object MyObject, which has local variables, and some
methods. One of the local variables is an HTML input box. On
mousedown I want to execute some code like this:
function MyObject(inputFieldID){
// get the HTML element
this.InputField = document.getElementById(inputFieldID);
// local variable
this.MyID = inputFieldID;
// function trying to run
this.MyFunction = function(){
alert(this.MyID);
}

this.InputField.onkeydown = this.MyFunction ;

}
Now when you keydown inside the input textbox it errors because inside
the MyFunction function "this" doesn't refer to the object MyObject,
but rather to the Input element.

The only workaround I have found is to give the InputField a reference
to its owner so you have:

this.InputField.MyObject = this;

And then when your MyFunction becomes:
this.MyFunction = function(){
alert(this.MyObject.MyID);
}
That works, but it seems like a pain to have to carry those references.

Is there another way to do this?

Aug 8 '05 #1
2 1475
"cmay" <cm**@walshgroup.com> writes:
I am having a problem with the use of "this". Maybe someone can help
me out here, let me know if I am doing this wrong: Lets say I have an object MyObject, which has local variables, and some
methods.
Objects don't have local variables, so I guess you just mean
properties.
One of the local variables is an HTML input box.
A DOM HTMLInputElement object.
function MyObject(inputFieldID){ .... this.MyFunction = function(){
alert(this.MyID);
} this.InputField.onkeydown = this.MyFunction ; ....
Now when you keydown inside the input textbox it errors because inside
the MyFunction function "this" doesn't refer to the object MyObject,
but rather to the Input element.
Yes. The "this" operator refers to the base object of the property
reference that was called. When the onkeydown property of the input
element is called, "this" will refer to the input element during
the execution of the body of the function. That means that
alert(this.MyID)
will alert the undefined value.
The only workaround I have found is to give the InputField a reference
to its owner so you have:

this.InputField.MyObject = this;
Refernces between DOM objects and other objects is known to cause
memory leak in IE. You are already doing that, but no need to compound
the problem :)
And then when your MyFunction becomes:
this.MyFunction = function(){
alert(this.MyObject.MyID);
} Is there another way to do this?


Try:

var self = this;
this.MyFunction = function() {
alert(self.MyID);
}

The "self" variable will copy the refrence to the MyObject instance,
so that it is available to the function.

/L
--
Lasse Reichstein Nielsen - lr*@hotpop.com
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'
Aug 9 '05 #2
Great, thanks.

Aug 10 '05 #3

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

9 posts views Thread by aden | last post: by
5 posts views Thread by ChrisB | last post: by
1 post views Thread by Peter Rilling | last post: by
8 posts views Thread by =?Utf-8?B?VHJlY2l1cw==?= | last post: by
6 posts views Thread by andrew.bell.ia | last post: by
reply views Thread by suresh191 | last post: by
reply views Thread by Gurmeet2796 | last post: by
reply views Thread by mdpf | last post: by
reply views Thread by harlem98 | last post: by
reply views Thread by listenups61195 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.