有點單身人士在JS

Question

我想確保如果一個#offer img發射一個附加到事件處理函數的函數，那麼沒有其他#offer img會觸發另一個函數，直到第一個函數完成其工作。我發現我需要一個Singleton來做這件事。 下面是我試圖做的：

$(document).ready(function() { 
    var inProgress = false; 
    $('#offer img').mouseover(function (event) { 
     if (!inProgress) { 
      inProgress = true; 

      $('#offer div img').addClass('gray'); 
      $(event.target).removeClass('gray'); 

      var clickedId = event.target.id; 
      var textId = '#' + clickedId.substr(0, clickedId.search('_')); 
      $('.innerContent p:visible').fadeOut(300, function() { 
       $(textId).fadeIn(); 
      }); 

      inProgress = false; 
     } else { 
      return; 
     } 
    }); 
}); 

不工作。這段代碼有什麼問題？ 任何幫助表示讚賞:)

Answer 1

問題是inProgress在所有fadeIn和fadeOut函數完成解析之前被設置爲False immediatley。所以你的mouseOver函數完成了，但是fadeIn和fadeOut不是。

如果你想INPROGRESS未進行設置，直到淡出完成類似

 $('.innerContent p:visible').fadeOut(300, function() { 
      $(textId).fadeIn(300, function(){ 
       inProgress = false; 
      }); 
     }); 

    } else { 
     return; 
    }