Код js показывает ошибку после создания нового экземпляра объекта

Question

Когда я создаю новый экземпляр объекта ClickEvent, он возвращает следующую ошибку. Click here для кода jsfiddle. Ниже приведен мой код

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

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

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

var c = new ClickEvent('event'); 
    c.show(); 

Почему он показывает эту ошибку и как ее решить?

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

Answer 1

Есть пара вопросов.

1. У вас есть опечатка в prototype.

2. this.ev.on('click', this.userInput()); должно быть this.ev.on('click', this.userInput); - вы хотите передать ссылку на функцию, чтобы она выполнялась, когда пользователь нажимает кнопку, вы не хотите вызывать ее при привязке обработчика событий.

Answer 2

Ошибка означает, что нет в библиотеке javascript метода userInput. Я могу сказать очень вероятно, так как вы не указали переменную userInput в любом месте до строки 3. Также .on() имеет два параметра: («EVENT», «FUNCTION»). В вашем коде this.userInput не является функцией и не может функционировать как один.

Answer 3

Вы писали prototype не правильный; your code otherwise executes fine, хотя вы хотели бы ссылаться на метод с this.userInput, а не ссылаться на него с this.userInput(), и из-за этого вы получаете оба сообщения 'show' и 'user', когда страница загружается.

С этими исправлениями ваш код functions as I expect you intend: 'user' появляется только при нажатии на ссылку.

Answer 4

фиксированный тип, немного изменение, это работает.

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

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

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

var c = new ClickEvent('event'); 
c.show();