$(this) from within a seperately called function

[fooman]

When using code such as:

$(".save").click(function(){

$(this).remove();

});

$(this) refers to the $(“.save”) element. So it’s removed or whatever you do with it.

Now what does $(this) refer to when you call a function from within the click?

$(".save").click(function(){

removeBtn():

});



function removeBtn(){

$(this).remove();

}

$(this) no longer refers to the $(“.save”) element. What exactly does it belong to now?
What if you had a few buttons that you wanted to have use this removeBtn() function and had to use $(this)?

[__]

You might find [this](http://yehudakatz.com/2011/08/11/understanding-javascript-function-invocation-and-this/) interesting.

IIUC, `this` inside `removeBtn` would be “undefined” (or, in most browsers, would fall back to `[object Window]`).

To make your example work:

$(“.save”).click( function(){
removeBtn( this );
});

function removeBtn( context ){
$(context).remove();
}

[__]

Well, functions in javascript *are* objects, so `this` “bubbles (that’s not really the right term) up” to the context the function has inherited from its parent – and, since you’ve declared your function globally, the “parent” is the `Window` object.

…and, no problem, glad you got it figured.

[noahgelman]

It’s a matter of scope. When you run a function, it can only use the data it’s given. If inside “Function A” you want to call “Function B”, then “Function B” doesn’t automatically get to use all the data (variables, functions, arrays, etc.) that exist in “Function A” unless you specially pass “Function B” the data.

This is a must in order to prevent conflictions. What if “Function A” and “Function B” use a variable with the same name? Then simply calling “Function B” would screw “Function A” up.

In your case, you are handing the **specific element data** that “this” refers to to the removeBtn function. So now removeBtn knows what your talking about.

If that makes any sense.

[noahgelman]

Yeah, that can definitely happen. It happens to everyone. It’ll never stop happening. Don’t let these mistakes define you as a developer.

[Author]

Posts