That's a great example, thanks Rik.
I would second your point that you don't need to use $this for the variable
name. In fact, I'd put it more strongly and recommend that a different
variable name be used. It's already pretty confusing the way jQuery uses
'this' for very different things in different contexts (jQuery object vs.
DOM element), and using $this just adds fuel to the fire.
Another reason not to use $this here is because it's a useful convention to
reserve the $ prefix on a variable name for variables that actually
represent a jQuery object. In the example, $this is actually a DOM element,
not a jQuery object.
Suppose you have a function that gets called from some other code (perhaps
legacy code) and has a DOM element passed to it, and you want to also get a
jQuery object referencing that DOM element. I might code it like this (hard
to avoid puns when talking about this):
function myFunction( element ) {
var $element = $(element);
// now, element is the DOM element itself, and
// $element is a jQuery object containing that element.
}
The reason for the $ convention is that $element *looks* a lot like
$(element), so it's a nice visual reminder that the variable refers to a
jQuery object.
Also, in many cases I think it's better to avoid using 'this' with an each()
callback in the first place, and instead use the named parameter that jQuery
provides for the each() callback. After all, if you're going to have to
assign 'this' into a variable, you may as well just get the variable as a
parameter in the first place. The code for your example could then look
like:
$('div').each( function( i, div ) {
$(div).find('a').click( function() {
alert(this); // the A element
alert(div); // the DIV element
});
});
-Mike
> From: Rik Lomas
>
> The reason some people use $this is due to Javascript's
> scope. They use var $this = this; as a placeholder for the
> scope at that instance, for example:
>
> $('div').each(function () {
> var $this = this;
> $(this).find(a).click(function () {
> alert(this);
> alert($this);
> });
> });
>
> The difference between this and $this is that "this" refers to the "a"
> element and "$this" refers to the div element. You don't have
> to use $this, you can use any variable name you like
>
> Hope that helps
>
> Rik
> 2008/12/8 SLR <[EMAIL PROTECTED]>:
> >
> > I'm pretty new to jQuery and I get pretty lost when using the $this
> > variable. I've seen people use it in so many different
> ways-- ($this,
> > $ (this), $.this, $.(this), etc-- to where I don't know
> which way is
> > the correct way to use it. Anyways, can somebody look at
> the following
> > code and tell me what I'm doing wrong? I have a feeling it
> has to do
> > with the way I'm using the $this variable...
> >
> > $("#rightDiv").hover(
> > function()
> > {
> > $(this).css({visibility: 'visible';}); },
> >
> > function()
> > {
> > $(this).css({visibility: 'hidden';});
> > }
> > );
> > >
> >
>
>
>
> --
> Rik Lomas
> http://rikrikrik.com
>
