JSFiddle - React, Tailwind, and code Playground
HTML
<button id="me">Click me!</button>
<div id="log">
<div>
CSS
#log {
margin-top: 20px;
font-family: monospace;
}
strong {
font-weight: normal;
color: #f00;
}
JavaScript
var $b = $("#me");
var $l = $("#log");
var log = function(handles, evt){
$l.append("<strong>" + handles + "</strong> handler, event type: <strong>" +
evt.type + "</strong>, namespace: <strong>" +
(evt.namespace?evt.namespace:'') + "<strong/><br/>");
}
$b.click(function(evt){
log('click', evt);
$b.trigger('someEvent');
$b.trigger('someEvent.myns');
$b.trigger('anotherEvent');
$b.trigger('my:anotherEvent');
});
$b.bind('someEvent', function(evt){
log('someEvent', evt);
});
$b.bind('someEvent.myns', function(evt){
log('someEvent.myns', evt);
});
$b.bind('anotherEvent', function(evt){
log('anotherEvent', evt);
});
$b.bind('my:anotherEvent', function(evt){
log('my:anotherEvent', evt);
});