javascript - jquery 和多元素悬停检查

Question

我有 3 个框，一旦用户将鼠标悬停在任何一个框上，如果通过 featVals 哈希表将大主 div 的内容从默认更改为相关 div

在我的代码的 if ($('#estate-feature, #carrier-feature, #cleaning-feature').is(':hover')) { 部分，我想要检查这 3 个 div 框当前是否悬停，如果没有显示默认内容(defaultFeat 变量)。

但是，我从 Google Chrome Javascript 控制台收到 未捕获的语法错误，无法识别的表达式:悬停 错误。

如何修复它？

问候

$('#estate-feature, #carrier-feature, #cleaning-feature').hover(function () {
    var currentFeatCont = featVals[$(this).attr('id')];
    headlineContent.html(currentFeatCont);
}, function () {
    headlineContent.delay(600)
        .queue(function (n) {
        if ($('#estate-feature, #carrier-feature, #cleaning-feature').not(':hover')) {
            $(this).html(defaultFeat);
        }
        n();
    })
});

Answer 1

:hover 不是元素的属性。此外，您还绑定(bind)到悬停位置，这样您就知道您已离开悬停位置并且可以恢复默认内容。如果您希望悬停触发的内容在该点离开触发元素后保留一段时间，那么您需要假设您不会滚动另一个触发器，或者实现一个共享标志变量来指示是否应停止默认文本恢复。例如

var isHovered = false;
$('#estate-feature, #carrier-feature, #cleaning-feature').hover(
    function() {
                var currentFeatCont = featVals[$(this).attr('id')];
                headlineContent.html(currentFeatCont);
                isHovered = true;
    }, 
    function() {    
            isHovered = false;
            headlineContent.delay(600)
            .queue(function(n) {
                if (!isHovered) {
                    $(this).html(defaultFeat);
                }
                n(); 
            })
    }
);