jquery - 设置变量以避免函数执行

Question

我有 2 个元素图像和 div 相互重叠，当我单击 div 时，它会调用 transitIT() 来旋转 div 但是如果我再次单击太快，则调用图像单击我不明白如何，我尝试使用event.stopPropagation()和设置clickedEnabled 以避免图像点击，但图像点击事件被调用。

$(document).on('click', '#front', function(event) {
event.stopPropagation();
//alert('Front Clicked globe='+globe);
 transitIT(this);
 });


 $(document).on('click', 'img', function() {
  alert('htmlcalled image Clicked Called='+clickEnabled);

/*to check if div is transitioning state*/
    if (!clickEnabled){return;}

    //Doing some alignement for image               ...........

     });

Answer 1

我建议您测试元素 id，因为您不知道实际调用两个回调的顺序。

  $(document).on('click', 'img', function() {
    if (this.id !== "front")
    {
      alert('htmlcalled image Clicked Called='+clickEnabled);
    }
 });

Answer 2

您可以这样做以防止事件冒泡：

$(document).on('click', 'img', function (event) {
    if (event.target.tagName !== 'IMG') return;

    alert('htmlcalled image Clicked Called=' + clickEnabled);
    //Doing some alignement for image ...........
});