1

我在一个网站上工作，想修改下拉菜单项的当前代码。这是当前代码：

$(document).ready(function () { 

$('#nav li').hover(
    function () {
        //show its submenu
        $('ul', this).slideDown(300);

    }, 
    function () {
        //hide its submenu
        $('ul', this).slideUp(300);         
    }
);

});

我尝试更改代码以添加超时，目的是在用户将鼠标从菜单上移开时设置超时，以便菜单不会立即切换上滑效果。我想要的效果是，如果用户将鼠标从菜单上移开 200 毫秒，然后将其移回菜单，则它不会执行任何操作。所以菜单要等待 300-400 毫秒才能切换上滑功能。这是我编写的不起作用的代码。部分原因是this无论如何$('ul', this).slideUp(250);，这是我尝试实现的代码不起作用：

$(document).ready(function () { 
var timeoutID;
$('#nav li').hover(
    function () {
        //show its submenu
        $('ul', this).slideDown(250);
        window.clearTimeout(timeoutID);
        timeoutID = window.setTimeout(SlideUp, 350);
    },  
);
function SlideUp() {
    //hide its submenu
    $('ul', this).slideUp(250);         
}
});

让程序等待切换上滑功能的最佳方法是什么？任何想法表示赞赏。谢谢。

4

3 回答 3

2

这就是你想做的。

$(document).ready(function () { 
  var timeout;
  $('#nav li').hover(function () {
    //show its submenu
    clearTimeout(timeout);
    $('ul', this).slideDown(300);
  }, function () {
    //hide its submenu
    var self = this;
    timeout = setTimeout(function(){
      $('ul', self).slideUp(300);         
    }, 300);
  });
});​
于 2012-06-13T20:27:42.910 回答
0

jQuery.Deferred()，在 1.5 版本中引入，是一个可链接的实用程序对象，可以将多个回调注册到回调队列中，调用回调队列，并中继任何同步或异步函数的成功或失败状态。

看看这个。

于 2012-06-13T20:18:14.123 回答
0

不是您的具体问题的答案，但transition-delay如果可能的话，我会使用fiddle。

于 2012-06-13T20:50:19.723 回答