jquery切换打开和关闭2格

Question

我有以下代码来打开和关闭两个单独的div的工作正常。然而，我试图实现的是，如果一个潜水是开放的，我点击打开另一个打开的关闭，反之亦然。有人能指引我走向正确的方向吗？

 $(document).ready(function(e) { 
     var menuopen = false; 
     $("#searching").click(function(e) { 
     if (menuopen == false) { 
     $("#search").animate({ 
     top: "111px" 
      }, 1000) 
    menuopen = true; 
    } 
    else if (menuopen == true) { 
    $("#search").animate({ 
    top: "-110px" 
    }, 1000) 
    menuopen = false 
    } 
}); 
    $("#navigation").click(function(e) { 
    if (menuopen == false) { 
    $("#menu").animate({ 
    top: "111px" 
    }, 1000) 
    menuopen = true; 
    } 
    else if (menuopen == true) { 
    $("#menu").animate({ 
     top: "-410px" 
    }, 1000) 
    menuopen = false 
    } 
    }); 
}); 

Answer 1

这里有一个概念，它是如何工作的，也为双击等：

1. 在打电话之前，动画设置指示动画正在进行的标志。

2. 如果设置了此标志，则立即返回并且不要调用动画。

3. 向重置标志的动画调用添加回调函数（例如完成），以便菜单再次变为负责。

4. 以某种方式跟踪菜单的状态（变量或类指示按照需要进行造型时的状态），以便您知道哪一个必须关闭或打开。

因此，您可以创建一个函数menuSelected并从所有菜单点击函数中调用它。

您可以切换每次点击，当点击一个菜单时也点击另一个点击，但这很危险，例如，如果您立即进行多次点击，则事件可能会叠加，您将看到菜单打开并关闭数次。

Answer 2

你想«触发»两个工作动画......在此基础上

，你可以尝试：

$(document).ready(function(e) { 
    $("#searching").click(function(e) { 
     searchOpen(true); 
     menuOpen(false); 
    }); 
    $("#navigation").click(function(e) { 
     searchOpen(false); 
     menuOpen(true); 
    }); 
}); 

function searchOpen(logic){ 
    if (logic) { 
     $("#search").animate({ 
      top: "111px" 
     }, 1000) 
    } 
    else { 
     $("#search").animate({ 
      top: "-110px" 
     }, 1000) 
    } 
} 

function menuOpen(logic){ 
    if (logic) { 
     $("#menu").animate({ 
      top: "111px" 
     }, 1000) 
    } 
    else { 
     $("#menu").animate({ 
      top: "-410px" 
     }, 1000) 
    } 
}