how to call foo only if click OR focus fired
One more version of debounce function implementation:
link: function($scope, $element, $attrs) {
var callOnce = (function() {
var timeout;
return function(e, callback) {
clearTimeout(timeout);
timeout = setTimeout(function() {
callback.call(self, e);
}.bind(this), 200);
};
})();
$element.bind('click focus mouseover', function(e) {
callOnce.call(this, e, foo);
});
}
Demo: http://plnkr.co/edit/HjwedaqUcGj6KncpDtwJ?p=preview
You can debounce the events, that would only fire the function for the first event
$element.bind('click focus', function(e) {
if ( !$(this).data('fired') ) foo(e);
$(this).data('fired', true);
setTimeout(function(self) {
$(self).data('fired', false);
}, 200, this);
});
FIDDLE