how to call foo only if click OR focus fired

0

Issue

I have a directive in which I bind focus and click events to element:

app.directive('mydirective', function () {
  return {
    link: function ($scope, $element, $attrs) {
      $element.bind('click focus', function (e) {
        foo(e);
      });
    }
  };
});

I want to call foo once if focus or click event fired. But when clicking on element, focus event gets fired and foo gets called twice. how to prevent calling foo for the second time?

Edit:
Yes. I wasn’t a good idea to mix hover with click and focus. Thanks every body

Solution

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

Answered By – adeneo

This Answer collected from stackoverflow, is licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0

Leave A Reply

Your email address will not be published.

This website uses cookies to improve your experience. We'll assume you're ok with this, but you can opt-out if you wish. Accept Read More