JQuery event handler scope

Question

Say I have this (jqueryUI plugin):

  $.widget('ui.someplugin', {
    _create: function() {
      return $(this.element).click(this._onClick);
    },
    _onClick: function(e) {
      return this._someFunc();
    },
    _someFunc: function() {
      return console.log('someFunc');
    }
  });

It doesn't work - _onClick receives the DOM element as its scope. I could have the handler reference the plugin again with $(e.target).data('someplugin'), but thats then useless if I want to subscribe to other DOM element events. How do I rejig it so that it does what I want?

score 7 · Accepted Answer · edited May 23 '17 at 12:06

7

Use $.proxy(func, context);, where func will get called with the scope of context.

return $(this.element).click($.proxy(this._onClick, this));

See also: Controlling the value of 'this' in a jQuery event

edited May 23 '17 at 12:06

Community

1
1

answered Sep 10 '11 at 11:24

bbg

2,892
3
19
13

JQuery event handler scope

1 Answers1