Question

我正在使用以下代码，但它返回以下错误

 Uncaught TypeError: Object [object HTMLAnchorElement] has no method 'userInput'

以下是代码jsfiddle

var ClickEvent = function (event) {
    this.ev = $('.' + event);
    this.ev.on('click', function () { this.userInput(); });
};

ClickEvent.prototype = function () {
    return {
        userInput: function () {
            console.log('user');
        },

        show: function () {
            console.log('show');
        }
    };   
}();

var c = new ClickEvent('event');

我在userInput回调函数中调用on()函数，但它返回error以上。

我该如何解决这个问题？

Answer 1

问题是点击回调处理程序中的执行上下文（this）没有指向ClickEvent实例，它正在引用被点击的dom元素。

您需要使用

this.ev.on('click', $.proxy(function () { this.userInput(); }, this));

演示：Fiddle

或

var that = this;
this.ev.on('click', function () { that.userInput(); });

演示：Fiddle

Answer 2

this.userInput()嵌套在回调函数中，因此在其中作用域。您可以将您需要的this实例外部化，如下所示：

var ClickEvent = function (event) {
    var $this = this;
    $this.ev = $('.' + event);
    $this.ev.on('click', function () { $this.userInput(); });
};

Answer 3

"this"函数中的onclick引用了"this.ev"

"$('.' + event);"

不是"userInput"和"show"的对象。

对象在javascript中没有方法错误

3 个答案: