使用$ .proxy javascript调用函数

Question

I want to load a function on click event using $.proxy. If i load the function using the below click event then everything works fine.

click event which is working

$('element').click($.proxy(this.doProcess, this));

click event which is not working

$('element').click(function(){
    // Perform other things
    $.proxy(this.doProcess, this);  
});

As you can see that i want to perform other things on the click event before loading the function. Can you please help me figure out why it is not loading if i use ".click(function()..." instead of simply '.click()..'

Answer 1

Because in the first snippet the click function calls the returned function. In the second snippet you are binding the current this value to the function, but you don't call the returned function. You can use the invocation operator ( () ) for calling the function:

$.proxy(this.doProcess, this)();  

Note that this in the context of the anonymous function (which is the current event handler) doesn't refer to the this keyword's value of the outer context, you can cache the value:

var that = this;
$('element').click(function() {
    // Perform other things
    $.proxy(that.doProcess, this)(/* arguments go here */);  
//           |               |
//           |               ----- refers to the clicked element
//           ----- reference of the outer context's `this` value
});