如果一個元素已經可見，我該如何阻止它切換

Question

我在頁面上有一個懸停狀態和onclick狀態。我也有一個關於懸停狀態的切換。如果用戶已經點擊了一個元素，如果懸停事件重新發生，我該如何停止該元素的切換？

$("#ex").hover(function() { 

$("#prod").toggle(300).delay(1000); 
$("#test").toggle(300).delay(1000); 
$("#dev").toggle(300).delay(1000); 

}); 

$("#prod").click(function() { 
$("#prod").unbind("mouseenter mouseleave"); 
$("#prod").finish(); 
$("#prod").show(); 
}); 

$("#test").click(function() { 
$("#test").unbind("mouseenter mouseleave"); 
$("#test").finish(); 
$("#test").show(); 
}); 

$("#dev").click(function() { 
$("#dev").unbind("mouseenter mouseleave"); 
$("#dev").finish(); 
$("#dev").show(); 
}); 

Answer 1

使用.is(":visible")選擇並檢查它是否是可見的，如果是這樣，不切換。

$("#ex").hover(function() { 
    if (!$("#prod").is(":visible")) $("#prod").toggle(300).delay(1000); 
    if (!$("#test").is(":visible")) $("#test").toggle(300).delay(1000); 
    if (!$("#dev").is(":visible")) $("#dev").toggle(300).delay(1000); 
});