setTimeout后的jquery函数

Question

我有一个下拉菜单，其中包含以下内容：

$(document).ready(function(){
var opened = false;
$("#menu_tab").click(function(){
    if(opened){
        $("#menu_box").animate({"top": "+=83px"}, "slow");
        setTimeout(function(){
                $("#menu_box").animate({"top": "+=83px"}, "slow");
                }, 2000);
                clearTimeout();
    }else{
        $("#menu_box").animate({"top": "-=83px"}, "slow");
    }
    $("#menu_content").slideToggle("slow");
    $("#menu_tab .close").toggle();
    opened = opened ? false : true;
});
});

因此，单击 menu_tab 后，菜单会下降并保持不变，直到再次单击，但我想要一个超时，以便在 2 秒后菜单再次下降。

我显然编码错误，因为超时不起作用。任何帮助将不胜感激！ TIA。

Answer 1

我认为你正在尝试做这样的事情：

尝试一下： http://jsfiddle .net/YFPey/

var opened = false;
var timeout;
$("#menu_tab").click(function() {
      // If there's a setTimeout running, clear it.
    if(timeout) {
        clearTimeout(timeout);
        timeout = null;
    }
    if(opened) {
        $("#menu_box").animate({"top": "+=83px"}, "slow");
    } else {
        $("#menu_box").animate({"top": "-=83px"}, "slow");
             // Set a timeout to trigger a click that will drop it back down
        timeout = setTimeout(function() {
            timeout = null;
            $("#menu_tab").click();
        }, 2000);
    }
    $("#menu_content").slideToggle("slow");
    $("#menu_tab .close").toggle();
    opened = !opened;
});​

Answer 2

您在这里使用的clearTimeout()是错误的。您需要向其传递一个对使用 setTimeout() 创建该计时器时返回的 ID 的引用。

但不能说这是否导致了您的问题（可能不是）。如果您在 Javascript 错误控制台中得到任何可能有帮助的信息。

Answer 3

有两件事对我来说很突出：

1. 因为 opened 开始时为 false，因此计时器仅在第二次单击时启动。
2. 在计时器处理程序中，您是否应该更新opened。