Как добавить обработчики событий в прототип объекта в JavaScript - PullRequest
Новая
       42

Как добавить обработчики событий в прототип объекта в JavaScript

2 голосов
/ 06 января 2012 
var MyObj = function(h,w){
   this.height = h;
   this.width  = w;
}

Я хотел бы зарегистрировать некоторый обработчик событий для всех экземпляров этого объекта.

Скажем, к примеру, я хотел бы иметь кнопку закрытия, когда пользователь нажимает на кнопку, он должен закрыть этот конкретный объект.

Так как добавить обработчики событийк его прототипу, чтобы я мог создавать эти объекты на лету.

1 Ответ

3 голосов
/ 06 января 2012

Обработчики событий - это в значительной степени просто функции, которые запускаются при вызове в соответствующее время.Похоже, вы хотите, чтобы другой объект (например, кнопка) реагировал на событие, которое затем закрывает ваш объект.В этом случае кнопка является прослушивателем событий, а не вашим объектом, поэтому вы, вероятно, просто установите обработчик onclick кнопки для соответствующей функции close на вашем экземпляре объекта.

Если вы действительно хотите повернуть его по-другому, вы можете сделать что-то действительно простое, например, так: 

var MyObj = function(h,w){
   this.height = h;
   this.width  = w;

   this.close = function(){ /** Do close */ }
   this.addCloser = function(closebutton){ closebutton.onclick = this.close(); }
}

, которое будет использоваться примерно так: 

var myo = new MyObj();
myo.addCloser(document.getElementById('mybutton'));

Однако, если вы хотите, чтобы ваш объект генерировал события, в которые применяются зарегистрированные функции-обработчики, вы можете захотеть сделать что-то более сложное, например: 

var MyObj = function(h,w){
   this.height = h;
   this.width  = w;
   this.handlers = {};
   this.events = ['close', 'beforeclose'];

   this.beforeClose = function(){
       for(var i = 0, l = this.handlers.beforeclose.length; i < l; i++){
           this.handlers.beforeclose[i].call(this);
       }
   }

   this.afterClose = function(){
       for(var i = 0, l = this.handlers.close.length; i < l; i++){ 
           this.handlers.close[i].call(this);
       }
   }

   this.close = function(){ this.beforeClose(); /**Do close */ this.afterClose(); }
   this.registerHandler = function(type, func){ 
       if(this.events.indexOf(type) == -1) throw "Invalid Event!";
       if(this.handlers[type]){ 
           this.handlers[type].push(func); 
       } else { 
           this.handlers[type] = [func]; 
       } 
   }



}

ИЛИ что угодно, что можно использовать, например, так: 

var myo = new MyObj();
myo.registerHandler('beforeclose', function(){alert("I'm closing!");});
...