Heim >Web-Frontend >js-Tutorial >Benutzerdefinierte Ereignisse in Javascript

Benutzerdefinierte Ereignisse in Javascript

高洛峰
高洛峰Original
2016-11-16 11:22:351556Durchsuche

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]=='undefined'){
                    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);
                    }
                }
            }
        }

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);


Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn