Question

我是jquery的新手，我正在尝试在下拉菜单中使用.slidedown函数。我希望菜单在单击时打开，并在再次单击选项或菜单时关闭。但是，当单击菜单时，它只是弹跳打开和关闭而不是保持打开状态。这是代码：

*(function($) {



/*  $('#drop').click(function() {
        if (paneldown == false) {
            $('#ddd').slideUp(5000);
            paneldown = false;
        }
        if(paneldown != false) {
            $('#ddd').slideDown(5000);
            paneldown = true;
        }
                              });

    */                       
    var paneldown = false;

   $('#drop').click(function() {
        if(paneldown == false) { $('#ddd').slideDown(500); paneldown = true; }

        if(paneldown == true) { $('#ddd').slideUp(500);  paneldown = false;}
      //$('#ddd').toggle(5000), (function() {
//      });
    });
})(jQuery);
// JavaScript Document*

Answer 1

改为使用slideToggle：

$('#drop').click(function() {
    $('#ddd').slideToggle(500);
});

为你处理状态，所以你不必担心它。现有代码存在的问题是，首先运行slideDown，然后将paneldown设置为true。然后在你检查paneldown == true之后是否正确（它是这样的;你只是这样设置）所以它运行slideUp。

Answer 2

如果您要使用if语句，则不得处理if语句：

$('#drop').click(function() {
     $('#ddd').slideToggle(500); 
 });

顺便说一下，你的菜单只是向上滑动，因为你使用了两个if语句。在第一种情况下，“paneldown”是“false”。菜单向下滑动。现在您将“paneldown”设置为“true”。现在你有第二个if语句，“paneldown”现在是“true”，所以它会向上滑动。如果你想保留你的if语句，你应该使用if-else-construction：

$('#drop').click(function() {
        if (paneldown == false) {
            $('#ddd').slideUp(5000);
            paneldown = false;
        }
        else {
            $('#ddd').slideDown(5000);
            paneldown = true;
        }
});

Answer 3

如果您仍想使用if语句，请执行以下操作：

var paneldown = false;
  $('#drop').click(function () {
          if (paneldown == false) {
              $('#ddd').slideDown(500);
              paneldown = true;
          } else {
              $('#ddd').slideUp(500);
              paneldown = false;
          }
  });

如果你尝试使用两个ifs它不会工作，但我不推荐使用ifs这样的东西。使用方法：

$('#drop').click(function() {
    $('#ddd').slideToggle(500);
});

Answer 4

您的代码执行if语句！这样做：

$('#drop').click(function() {

        if(paneldown) { $('#ddd').slideUp(500);  paneldown = false;}
        else { $('#ddd').slideDown(500); paneldown = true; }

});

jquery .slidedown

4 个答案: