So I have the following:

var change_handler = function(element) {
    // ... do some fancy stuff ...
}

Now, I want to attach this to an element. Which is the better/best or more correct method?

$('element_selector').change(change_handler(this));

Or...

$('element_selector').change(function() { change_handler(this); });

And does it make any difference if you're passing the object to the function or not?

So I have the following:

var change_handler = function(element) {
    // ... do some fancy stuff ...
}

Now, I want to attach this to an element. Which is the better/best or more correct method?

$('element_selector').change(change_handler(this));

Or...

$('element_selector').change(function() { change_handler(this); });

And does it make any difference if you're passing the object to the function or not?

• javascript
• jquery
• onchange

Share Improve this question Follow edited Jan 29, 2012 at 13:10 PeeHaa 72.8k6060 gold badges194194 silver badges264264 bronze badges asked Dec 24, 2010 at 4:27 Darryl HeinDarryl Hein 145k9696 gold badges223223 silver badges263263 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 6

Neither..

$('element_selector').change(change_handler);

change_handler will be the so to speak pointer to the method and the argument of the element is already passed by jQuery

If you were to use $('element_selector').change(change_handler(this)); it wouldn't actually assign the method as the handler but rather run the method and attempt to assign the result as the handler, the other option is superfluous because you can use the method name as described above instead of re-wrapping the method.

This is another way to approach the problem given by the OP... partial function application a la another SO Q. Bind the change handler with the arg of interest and pass the resulting partial as the arg to the change handler:

var myChangeHandler = partial(change_handler, this);
$('element_selector').change(myChangeHandler);