javascript - 暂时停用.hover

Question

我试图弄清楚如何由于页面上的事件而暂时禁用jquery中的.hover。

我当前的jsfiddle看起来像这样。.http://jsfiddle.net/4vhajam3/3/
（请注意，出于理智的考虑，我已经放弃了很多代码）

当前的页面设置是，如果将鼠标悬停在任何类“ toqc”上，则要质量控制的图像显示在下面的div中。我的需要是，如果用户单击表格单元格之一，则鼠标悬停将被暂时禁用（例如10秒钟），以便他们可以在页面上四处移动而不更改div中的图像。

我查看了此网站上的其他一些问题（即jQuery: temporarily disable hover... unintended side effect），虽然我理解了代码，但似乎无法对其进行修改以使其适合我。我特别在尝试

    var hoverEnabled = true;

$('.toqc').click(
    function(){
        hoverEnabled = false;
    });

if(hoverEnabled){
    $('#ussfcanl').hover(function() {
    $('#imageholder').html('<img src="http://www.hpc.ncep.noaa.gov/sfc/satsfc.gif" />');                              
});
}

但是，即使在单击类.toqc之后，仍会在我移至另一个.toqc类时继续进行悬停。

任何帮助将不胜感激..Kinda迷失了我的代码从何而来。谢谢！

Answer 1

将条件放入其中，这样它将触发但什么也不做。

$('#ussfcanl').hover(function() {
    if(hoverEnabled){
        $('#imageholder').html('<img src="http://www.hpc.ncep.noaa.gov/sfc/satsfc.gif" />');                              
    }
});