Jquery - ul slidedown slideup

Question

我有问题，我的菜单下拉菜单，不知道为什么。下面是HTML：

<ul> 
          <li> 
           <font style="font-size: 12px;"><a href="?id=1" class="links">Quartos e Suites</a></font> 
           <img src="imgs/DownArrow.gif" class="arrowup" style="width:13px;height:13px"> 
           <ul class="submenu"> 
            <li><font style="font-size: 12px;"><a href="?id=1" class="links">Suite Presidencial</a></font></li> 
            <li><font style="font-size: 12px;"><a href="?id=1" class="links">Suite Executiva</a></font></li> 
            <li><font style="font-size: 12px;"><a href="?id=1" class="links">Suite Junior</a></font></li> 
            <li><font style="font-size: 12px;"><a href="?id=1" class="links">Quarto Superior</a></font></li> 
            <li><font style="font-size: 12px;"><a href="?id=1" class="links">Quarto Standart</a></font></li> 
           </ul> 
          </li> 
          <li> 
           <font style="font-size: 12px;"><a href="?id=2" class="links">Restaurante e Bar</a></font> 
           <img src="imgs/DownArrow.gif" class="arrowup" style="width:13px;height:13px"> 
           <ul class="submenu"> 
            <li><font style="font-size: 12px;"><a href="?id=1" class="links">Suite Presidencial</a></font></li> 
            <li><font style="font-size: 12px;"><a href="?id=1" class="links">Suite Executiva</a></font></li> 
            <li><font style="font-size: 12px;"><a href="?id=1" class="links">Suite Junior</a></font></li> 
            <li><font style="font-size: 12px;"><a href="?id=1" class="links">Quarto Superior</a></font></li> 
            <li><font style="font-size: 12px;"><a href="?id=1" class="links">Quarto Standart</a></font></li> 
           </ul> 
          </li> 

         </ul> 

和jQuery的：

$('.arrowup').click(function(){   
    var menu = $(this).next('ul'); 
    var thisimage = $(this); 
     //check if is any open and close 
     allmenu = $('.submenu:visible'); 
     if(allmenu.size() != 0){ 
      allmenu.slideUp(function(){ 
       $(this).prev('img').attr('src', 'imgs/DownArrow.gif'); 
       //check is the one is closing is not the one clicked 
       if($(this).not(menu)){ 
        menu.slideDown(function(){ 
      thisimage.attr('src', 'imgs/UpArrow.gif');  
     }); 
       }  
     }); 
     }else{ 
     //open the one clicked 
     alert(3); 
     $(this).next('ul').slideDown(function(){ 
      thisimage.attr('src', 'imgs/UpArrow.gif');  
     }); 
     } 
}); 

当一个是开放的点击关闭这里的主要问题是，它关闭和打开。 错误在这里：if（$（this）.not（menu））。但不知道为什么。

问候

Answer 1

可能取代这个代码：

  if($(this).not(menu)){ 
       menu.slideDown(function(){ 
     thisimage.attr('src', 'imgs/UpArrow.gif');  
    }); 
      }  

与此：

   menu.not(this).slideDown(function(){ 
     thisimage.attr('src', 'imgs/UpArrow.gif');  
    }); 

解释： “not” 采用一组元素，过滤器，然后返回一个新的不匹配选择器，参考或函数的元素集。在if语句中测试这些元素是没有意义的和无用的。 jQuery元素集合基本上是一个奇特的数组，当转换为布尔值时，所有Javascript中的数组都被视为true，即使它们是空的。

Answer 2

好的，当你测试是否有任何子菜单打开，你应该关闭它们，所以if语句if ($(this).not(menu))和内部代码应该被删除。

PS：如果menu打开和存储测试：从jQuery的网站，.not()方法返回一个jQuery对象，那么，如果是错误的说法，由于它始终是真实的......

你应该做的是它变成一个变量，然后关闭所有打开的子菜单，然后如果opened是假的，打开menu

Answer 3

$('.arrowup').click(function(){   
    var menu = $(this).next('ul'); 
    var thisimage = $(this); 
     //check if is any open and close 
     allmenu = $('.submenu:visible'); 
     if(menu.is(':visible')){ 

     }else{ 
      if(allmenu.size() != 0){    
       allmenu.slideUp(function(){ 
        $(this).prev('img').attr('src', 'imgs/DownArrow.gif'); 
        menu.slideDown();  
       }); 

      }else{ 
       //open the one clicked 
       $(this).next('ul').slideDown(function(){ 
        thisimage.attr('src', 'imgs/UpArrow.gif');  
       }); 
      } 
     }  
});