javascript - 根据条件使用slideUp()和slideDown()函数

Question

每当我单击 html 页面上的特定元素(在我的情况下，这是标签内的空白超链接)时，我都会使用代码来切换 html 页面中的面板:

    <script> 
     $(document).ready(function(){
      $("#technology").click(function(e){
        $("#technology_panel").slideToggle("slow");
        e.preventDefault()
        });
     });
    </script>

只要我只想向上/向下切换面板，这就可以正常工作。但我真正想要的是当我单击特定元素时，面板会下降，但是当我单击 html 页面上的其他任何位置时，面板应该上升。我尝试了此代码，但这并不按预期工作:

    if (document.getElementById(planning).click()== true)
    { 
     $(document).ready(function(){
       $("#planning").click(function(e){
         $("#planning_panel").slideDown("slow");
         e.preventDefault()
      });
    });
    }
     else
     {
         $(document).ready(function(){
               $("#planning").click(function(e){
                $("#planning_panel").slideUp("slow");
             e.preventDefault()
             });
           });
     }

Answer 1

将点击事件绑定(bind)到文档，并根据点击的元素使用逻辑

$(document).ready(function() {
    $(document).on('click',function(e) {
        e.preventDefault();
        var $panel = $("#planning_panel");
        if (e.target.id === 'planning') {
            $panel.slideDown('slow');
        } else {
            $panel.slideUp('slow');
        }
    }
});​