仅当用户在其上悬停3秒时显示菜单

Question

当用户将鼠标悬停在菜单上时，我希望显示并隐藏div，只有当用户将鼠标悬停在其上2秒时才会发生这种情况

我的代码

 $(".listing-menu li a").hover(function () {
                $(".listing-menu li a").removeClass('selected');       
                $("#divhouses,#divplots,#divproperties,#divapartment,#divprojects,#divbuilders").addClass("hide");
                var id = $(this).attr('id').replace("tab", "div"); $("#" + id).removeClass("hide");$(this).addClass('selected');
          }
        });

Answer 1

  

在jquery中使用SetTimeout。

setTimeout ( function() {

        // here call hover function
}, 2000);

Answer 2

尝试像

这样的计时器

$(".listing-menu li a").hover(function () {
    var $this = $(this);
    var timer = setTimeout(function () {
        $(".listing-menu li a").removeClass('selected');
        $("#divhouses,#divplots,#divproperties,#divapartment,#divprojects,#divbuilders").addClass("hide");
        var id = $this.attr('id').replace("tab", "div");
        $("#" + id).removeClass("hide");
        $this.addClass('selected');
    }, 2000);
    $this.data('hoverTimer', timer)
}, function () {
    clearTimeout($(this).data('hoverTimer'));
});