使用jquery設置延遲或超時

-1

$('.showmenu').bind("mouseenter", function (e) { 
       $('ul.secondul').show(); 
}); 
$('.showmenu').bind("mouseleave", function (e) { 
       $('ul.secondul').hide(); 
});

是否有辦法讓第二個函數不會立即啓動，但在1秒的延遲之後？因此，當用戶不小心將鼠標移出下拉菜單選項卡時，該選項卡將不會立即關閉，並讓用戶有機會將鼠標移回。因爲它是一個類，你可以有更多的.showmenu項目使用jquery設置延遲或超時

$('.showmenu') 
.bind("mouseenter", function (e) { 
    if($(this).data("timer")) 
     clearTimeout($(this).data("timer")); 
    $('ul.secondul').show(); 
}) 
.bind("mouseleave", function (e) { 
    $(this).data("timer", setTimeout(function(){ 
     $('ul.secondul').hide(); 
    }, 1000)); 
});

使用$(this).data：

來源

2013-04-25 Jerry

使用懸停：http://api.jquery.com/hover/ – 2013-04-25 18:50:10

http://stackoverflow.com/questions/2939980/jquery-how-to-sleep-or-delay的重複和所以很多其他。 – Colleen 2013-04-25 18:51:21

@Colleen你錯了。在這種情況下，Delay（）不起作用。 – Jerry 2013-04-25 18:52:21

你可以做到這一點。

來源

2013-04-25 18:50:02 Niels

你可以做這樣的事情 -

vat timeout; 
$('.showmenu').bind("mouseenter", function (e) { 
       $('ul.secondul').show(); 
       clearTimeout(timeout); 
}); 
$('.showmenu').bind("mouseleave", function (e) { 
      timeout = setTimeout(function(){ 
      $('ul.secondul').hide(); 
      },1000); 
});

來源

2013-04-25 18:50:24

我相信jQuery的懸停是你想要的內容：

$('.showmenu').hover(
    function() { 
     $('ul.secondul').show(); 
    }, 
    function() { 
     $('ul.secondul').hide(); 
    } 
);

來源

2013-04-25 18:54:01

這裏沒有任何延遲。 – showdev 2013-04-25 18:54:33

因爲它解決了所述問題，所以不需要這麼做：「因此，當用戶意外地將鼠標移出下拉菜單選項卡時，該選項卡將不會立即關閉，並讓用戶有機會將鼠標移回其上「。試試看。 – 2013-04-25 19:14:36

當用戶「將鼠標移出」時，我看不到您的代碼如何使該選項卡「不能立即關閉」。 http://jsfiddle.net/7VcwF/1/由於OP沒有提供HTML，也許我誤解了「下拉菜單選項卡」的含義。 – showdev 2013-04-25 19:34:25

如果使用fadeIn()和（或其他動畫），您可以用delay()這樣連鎖吧：

$('.showmenu').hover(

    function() { 
    $('ul.secondul').stop(true,true).fadeIn(200); 
    }, 

    function() { 
    $('ul.secondul').stop(true, true).delay(1000).fadeOut(200); 
    } 

);

小提琴：http://jsfiddle.net/7VcwF/

來源

2013-04-25 19:00:09 showdev

使用jquery設置延遲或超時

回答

相關問題