Let’s first define an event:
person = function(name ) {
this.name = name;
this.addEvents("walk");
}
Ext.extend(person, Ext.util.Observable, {
info: function( event) {
return this.name 'is' event 'ing.';
}
});
var person = new person('Zhang Minnuo');
person. on('walk', function() {
Ext.Msg.alert('event', person.name 'Walk and walk.');
});
Then we define a button to trigger the walk event:
var btn = new Ext.Button({
id: 'walk',
text: 'Trigger event button',
renderTo: Ext.getBody()
});
btn.on('click', function() {
person.fireEvent('walk');
});
The event is triggered when the button is clicked. The effect is as shown below Display:
Now we use the capture() function to intercept the triggering of the event, as shown in the following code:
var btn2 = new Ext.Button({
id: 'cc',
text: 'Interception event',
renderTo : Ext.getBody()
});
btn2.on('click', function() {
Ext.util.Observable.capture(person, function() {
alert(' fsdjhf');
return true;
});
});
At this time, click the btn2 button and find that the event will be triggered after the dialog box pops up. ,depressed. . . . Now try changing the last line of code to return false? The event was intercepted successfully!
This gives us an opportunity to choose, by controlling the return value of the processing function in capture() to decide whether to continue executing the listening function at a certain time, or directly abort the occurrence of the event.
We can also set multiple capture() interception functions for an object. These interception functions will form a processing chain. As long as any one of the interception functions returns false, the processing process will be aborted.
The releaseCapture() function is the reverse operation of the capture() function. It will clear all interception functions on fireEvent() at one time, but we cannot accurately delete a certain interception function through it. Once releaseCapture() is executed, all previously set interception functions will become invalid.