JSFiddle - React, Tailwind, and code Playground
HTML
<div>
<input id="searchInput" type="text" />
</div>
<div>
<input id="dragTest" type="text" value="dragMe" />
</div>
<div id="eventFiredLog"></div>
CSS
body {font-family:helvetica,arial,sans-serif;}
div {padding:10px;}
#eventFiredLog span {font-size:.7em;}
JavaScript
$(document).ready(function() {
$('#searchInput').bind('cut copy paste mousedown mouseup focus blur', function (e) {
setTimeout("handleMouseEvents('" + e.type + "');", 10);
});
});
var count = 0;
var handleMouseEvents = function (eventType) {
var now = new Date();
$('#eventFiredLog').html($('#eventFiredLog').html() + (++count).toString() + " - <b>" + eventType + "</b> event fired <span>(" + now.getHours() + ":" + now.getMinutes() + ":" + now.getSeconds() + ")</span><br />");
}