Benutzerdefinierte Ereignisse in Javascript-js-Tutorial-php.cn

Benutzerdefinierte Ereignisse in Javascript

高洛峰

Freigeben： 2016-11-16 11:22:35

Original

1574 Leute haben es durchsucht

Benutzerdefiniertes Ereignis: Der Benutzer kann den Ereignistyp angeben, der eigentlich eine Zeichenfolge ist, und dann eine Ereignisverarbeitungsfunktion für diesen Ereignistyp angeben (bei Aufruf verwaltet). Suchen Sie nach mehreren Ereignisbehandlungsfunktionen und rufen Sie sie dann auf.

function EventTarget(){
            this.handlers={};
        }
 
        EventTarget.prototype={
            constructor:EventTarget,
            addHandler:function(type,handler){
                if(typeof this.handlers[type]==&#39;undefined&#39;){
                    this.handlers[type]=new Array();
                }
                this.handlers[type].push(handler);
            },
            removeHandler:function(type,handler){
                if(this.handlers[type] instanceof Array){
                    var handlers=this.handlers[type];
                    for(var i=0,len=handlers.length;i<len;i++){
                        if(handler[i]==handler){
                            handlers.splice(i,1);
                            break;
                        }
                    }
                }
            },
            trigger:function(event){
                if(!event.target){
                    event.target=this;
                }
                if(this.handlers[event.type] instanceof Array){
                    var handlers=this.handlers[event.type];
                    for(var i=0,len=handlers.length;i<len;i++){
                        handlers[i](event);
                    }
                }
            }
        }

Nach dem Login kopieren

Die Methode addHandler dient zum Hinzufügen von Event-Handlern und die Methode removeHandler zum Entfernen von Event-Handlern. Alle Event-Handler werden einheitlich in den Attribut-Handlern gespeichert und verwaltet. Rufen Sie die Trigger-Methode auf, um ein Ereignis auszulösen. Diese Methode empfängt ein Objekt, das mindestens ein Typattribut als Parameter enthält. Wenn es ausgelöst wird, sucht es nach dem Ereignishandler, der dem Typ im Handler-Attribut entspricht. Schreiben Sie einen Code, um ihn zu testen.

function onClose(event){
            alert(&#39;message:&#39;+event.message);
        }
 
        var target=new EventTarget();
        target.addHandler(&#39;close&#39;,onClose);
 
        //浏览器不能帮我们创建事件对象了，自己创建一个，自定义事件对象的属性
        var event={
            type:&#39;close&#39;,
            message:&#39;Page Cover closed!&#39;
        };
 
        target.trigger(event);

Nach dem Login kopieren