1

我的问题是，当我尝试将函数添加为某个对象的侦听器时，它不尊重this创建被调用函数的范围。

现场演示：http: //jsfiddle.net/Ht4x9/

如您所见，将打印“MyActivity”，但不会showAct()单击红色。<div>结果是： MyActivity
undefined

我怎样才能点击<div>打印呢？将对象作为函数的参数传递真的有必要吗？我想以尽可能干净的方式做到这一点。

在下面粘贴代码以防万一

谢谢！

JS

var activity = 'MyActivity';

var Screen = {
    act: activity,

    _privFunc: function()
    {
        console.log(this.act);
    },

    publicFunc: function()
    {
        $('div').on('click', this._privFunc);
    },

    showAct: function()
    {
        this._privFunc();
    }
}

Screen.publicFunc();
Screen.showAct();

HTML + CSS

<div>CLICK</div>

div { background: red; width: 100px; height: 100px; cursor: pointer; font-weight: bold
4

3 回答 3

4

默认情况下，当事件处理程序在this处理程序内部执行时，将引用处理程序注册到的 dom 元素。在您的情况下，您需要使用自定义执行上下文来执行回调函数。这可以通过使用$.proxy()

jQuery: $.proxy()

$('div').on('click', $.proxy(this._privFunc, this));

下划线：绑定（）

$('div').on('click', _.bind(this._privFunc, this));

现代浏览器：bind()

$('div').on('click', this._privFunc.bind(this));
于 2013-10-28T00:57:48.020 回答
2

您只需要使用bind第一个参数并将其设置为this.

正如Arun 建议的那样，如果您有 jQuery 并且您正在使用旧版浏览器，那么 $.proxy是一个不错的选择。

于 2013-10-28T00:58:37.410 回答
0

你为什么不使用类似下面的东西？

var Screen = function () {
    var act = activity,
    _privFunc = function()
    {
        console.log(act);
    };

    this.publicFunc = function()
    {
        $('div').on('click', _privFunc);
    };

    this.showAct = function()
    {
        _privFunc();
    }
}

var s = new Screen();
s.publicFunc();
s.showAct();

http://jsfiddle.net/Ht4x9/7/

于 2013-10-28T01:16:25.860 回答