jQuery的向上滑动和向下滑动负一里一直滑下

Question

我有嵌套UL李名单

牙科

• 绝缘材料
  • 纸浆Devitalizer
  • 腐蚀剂
• 正畸
• 牙科药品

口服

使用下面的HTML

<ul class="nav" id="product-cat-menu"> 
<li> 
    <span class="right-plus main-plus"><i class="fa fa-plus-square-o"></i></span>Dental 
    <ul> 
     <li> 
     <span class="right-plus "><i class="fa fa-plus-square-o"></i></span>Isolation Materials 
     <ul> 
      <li>Pulp Devitalizer</li> 
      <li>Etchants</li> 
     </ul> 
     </li> 
     <li> 
     Orthodontics 
     </li> 
     <li> 
     <span class="right-plus "><i class="fa fa-plus-square-o"></i></span>Dental Medicines 
     </li> 
    </ul> 
    </li> 
    <li> 
    Oral 
    </li> 

#product-cat-menu ul{ 
display: none; 
} 

，我使用幻灯片下面的jQuery向上和向下滑动列表

$(document).ready(function() {  
$("#product-cat-menu .right-plus").click(function (evt) { 
    var $this = $(this);   
    $this.closest('li').siblings().find('ul').slideUp();  
    $this.siblings().slideDown(); 
    $this.find('i').removeClass("fa-plus-square-o");   
    $this.closest('li').siblings().find('span i').addClass("fa-plus-square-o"); 
    evt.preventDefault();   
});  
}); 

这是工作完美...但actualy我需要，第一李总是向下滑动时，页面加载。如何能够

Answer 1

你可以做到这一点的单击事件之后添加.first().click()

最终代码看起来像

$(document).ready(function() {  
    $("#product-cat-menu .right-plus").click(function (evt) { 
     var $this = $(this);   
     $this.closest('li').siblings().find('ul').slideUp();  
     $this.siblings().slideDown(); 
     $this.find('i').removeClass("fa-plus-square-o");   
     $this.closest('li').siblings().find('span i').addClass("fa-plus-square-o"); 
     evt.preventDefault();   
    }).first().click(); // new line 
}); 

Answer 2

可以使用触发点击事件的第一跨度：通过添加以下行代码

$(document).ready(function() {  
    $("#product-cat-menu .right-plus").click(function (evt) { 
    //your code 
    });  
    $("#product-cat-menu .right-plus").eq(0).click(); 
}); 

Answer 3

$("#product-cat-menu .right-plus:first").click();