Javascript 如何仅在单击或焦点触发时调用foo

我有一个指令，其中我将

焦点

和

单击事件

绑定到元素：

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

如果触发了

focus

或

单击
事件，我想调用
foo
一次。但当单击元素时，
focus
事件被触发，
foo
被调用两次。如何防止第二次调用
foo

编辑：
对我不是一个好主意混合悬停与点击和焦点。感谢大家
您可以取消对事件的影响，这只会触发第一个事件的功能

$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);

});


如果希望在单击和聚焦时调用
foo（）
，我建议只使用focus事件，因为单击不会单独触发，还会导致元素聚焦

正如您提到的，元素可能不会被输入，因此您只能使用click事件而不是focus

但在您的情况下，正如您所说，它被触发了3次，可能是click被触发两次，focus被触发一次，或者focus被触发两次，然后click被触发一次，在本例中使用
e.preventDefault（）在单击并聚焦事件中

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

这样可以确保同一事件回调不会继续执行两次

或者最简单的方法是检查元素是否输入了bind-the-focus事件，或者绑定click事件

app.directive('mydirective', function () {
  return {
    link: function ($scope, $element, $attrs) {

        if(element is input)
        {    
              $element.bind('focus', function (e) {
                e.preventDefault();
                foo(e);
              });
        }
        else
        {       
              $element.bind('click', function (e) {
                e.preventDefault();
                foo(e);
              });
        }
    }
  };
});


除盎司功能实现的另一个版本：

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);
    });
}

演示：为什么不只使用focus@naeem-这是一种工具提示，所以元素可能不是输入。我更正了我的问题如果你要将点击和焦点绑定在一起，那么你的foo函数会被触发两次，因为对于点击元素，你需要将光标焦点移动到该元素，所以第一个焦点会触发，然后你点击该元素，所以foo会再次触发点击事件，因此，请选择要绑定的click或focus事件。您可以使用jquery中的.one或收听Naeem Shaich，因为悬停总是被触发的。您不能在没有hover的情况下单击注意，您不应该绑定
hover
事件。