Question

我的侧边栏有一些ul和li元素。我需要slideDown()当前ul项click的下一个li。我尝试了一些但没有运气。有人可以帮我这个吗？以下是我的尝试：

我的HTML代码：

<li class="parent-li">Reports
    <i class="fa fa-cloud" style="font-size:10px;color:red;"></i>
    <ul>
        <li>Report1</li>
        <li>Report2</li>
        <li>Report3</li>
    </ul>
</li>

我的JavaScript代码：

$('parent-li').on("click", function(){
    $(this).next('ul').slideDown();
});

Answer 1

因为。next（）查找元素的兄弟元素而目标ul元素是子元素，所以应该使用。children（）或。{{3}选择ul元素。 }}（）。

并且请更正li元素的选择器作为类选择器以Dot开头。这是一个例子。

$('.parent-li').on("click", function() {
  $(this).children('ul').slideDown();
});

.hide
{
  display:none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<li class="parent-li">Reports
  <i class="fa fa-cloud" style="font-size:10px;color:red;"></i> 
  <ul class="hide">
    <li>Report1</li>
    <li>Report2</li>
    <li>Report3</li>
  </ul>
</li>

Answer 2

尝试使用.find()，如下所示：

$('parent-li').on('click', function(){
    $(this).find('ul').slideDown();
});

Answer 3

您尝试向下滑动的UL实际上嵌套在LI中，因此您的代码将无法在LI中找到UL。您还需要在CSS选择器中添加一个点，以找到类型为“parent-li”

的LI

尝试使用以下内容：

$('.parent-li').on("click", function(){
     // the .first() is optional but it'll find the first UL inside the LI
     $(this).find('ul').first().slideDown(); 
});

如何在jquery中单击当前li时获取下一个ul元素

3 个答案: