javascript - Jquery Slide up and Slide down -first li always slide down

Question

我嵌套了 ul li 列表

> dentry

• > 隔离 Material
  • 活髓剂
  • eclipse 刻剂
• > dentry 矫正
• > dentry 药品

> 口服

使用下面的 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();        
});    
});

这工作得很好......但实际上我需要，第一个 li 总是在页面加载时向下滑动。怎么可能

Answer 1

您可以使用以下方法触发第一个跨度的点击事件:

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