JQuery Custom Event Sequenz
-
22-10-2019 - |
Frage
Ich erstelle ein benutzerdefiniertes JS -Objekt. Dieses Objekt führt einige aus action
. Ich möchte in der Lage sein, den Verbraucher über das Objekt zu informieren (indem ich benutzerdefinierte Ereignisse auslöste) action
wird aufgeführt und action
wird bereits durchgeführt. (Dieses Verhaltensmodell ist in ASP.NET bekannt onBeforeAction
und onAfterAction
Veranstaltungen).
Der schwierige Teil ist, dass ich möchte, dass der Verbraucher die Ereignissequenz stoppen/unterbrechen kann.
Hier ist ein Algorithmus (im menschlichen#) des gewünschten Verhaltens:
this.trigger('onBeforeAction'); if (!onBeforeAction.wasCanceled){ this.doAction(); this.trigger('onAfterAction'); }
Wenn Sie diese Funktionalität in meinem Objekt haben, würde der Verbraucher so etwas tun:
$(myIntance).bind('onBeforeAction', function(){ if (!someCondition.satisfied) return false; return true; }); $(myIntance).bind('onAfterAction', function(){ // respond to action here });
Alle Ideen zur Implementierung einer "kontrollierbaren" Ereignissequenz wären großartig.
Danke im Voraus.
// R
Lösung 2
Ich glaube, ich habe eine Lösung gefunden.
Folgendes habe ich mir ausgedacht:
// my object
function Car(){
this.currentSpeed = 0;
}
Car.prototype.goFaster = function(){
var event = $.Event('beforeSpeedIncrease');
$(this).trigger(event); // notify "onBeforeAction"
if (!event.isDefaultPrevented()){
this.currentSpeed += 10; // actual action
$(this).trigger('afterSpeedIncreased'); // notify "onAfterAction"
}
}
Dann könnte ein Verbraucher so handeln:
var speedLimit = 30;
var carUnderControl = new Car();
$(carUnderControl)
.bind('beforeSpeedIncrease', function(e){
if (carUnderControl.currentSpeed >= speedLimit){
e.preventDefault();
console.log('Speed increase prevented, current speed: ' + carUnderControl.currentSpeed);
}
})
.bind('afterSpeedIncreased', function(){
console.log('Current speed: ' + carUnderControl.currentSpeed);
});
Ich habe das in Firefox mit Firebug (natürlich) gelaufen. Ausführung carUnderControl.goFaster();
von Firebugs Konsole für dreimal gezeigt aus Momentane Geschwindigkeit: ... Nachricht dreimal. Nachfolgende Hinrichtungen von goFaster()
Methode gezeigt Geschwindigkeitserhöhung verhindert Botschaft.
Das ist die Funktionalität, die ich erreichen wollte.
Alle Empfehlungen, wie Sie dies verbessern können, sind sehr willkommen.
Vielen Dank
Andere Tipps
(function ($) {
var origin = $.fn.click;
$.fn.click = function(event) {
//before function
origin.call(this, event);
//after function
// remember to use return as this could help with jq chainability
};
})(jQuery);
Ersetzen Sie Klick durch Ihren benutzerdefinierten Ereignisnamen :)