Question

我遇到了遍历DOM的问题。

<div class="dropdown-left"> <ul> <li> Parent 1 <ul class="dropdown-right"> <ul class="dropdown-right-col1"> <li>Test 1</li> <li>Test 2</li> <li>Test 3</li> </ul> </ul> </li> <li> Parent 2 <ul class="dropdown-right"> <ul class="dropdown-right-col1"> <li>TEST 4</li> <li>TEST 5</li> <li>TEST 6</li> </ul> </ul> </li> </ul> </div>

jQuery使用此代码显示结果。它找到了所有ul.dropdown-right，我只想让它找到孩子。

$(".dropdown-left").bind('click', "li", function() {
    $(this).find("ul.dropdown-right").slideToggle(150);

这是我想要使用的代码，但它不会显示任何结果。

$(".dropdown-left").bind('click', "li", function() {
    $(this).next("ul.dropdown-right").slideToggle(150);

谢谢！

Answer 1

我认为你需要这个功能：

＆＃13;

$(document).ready(function() {
  $(".dropdown-left").bind('click', function() {
    $(this).children('ul.dropdown-right').slideToggle(150);
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <ul>
    <li class="dropdown-left">
      Parent 1
      <ul class="dropdown-right">
        <ul class="dropdown-right-col1">
          <li>Test 1</li>
          <li>Test 2</li>
          <li>Test 3</li>
        </ul>
      </ul>
    </li>
    <li class="dropdown-left">
      Parent 2
      <ul class="dropdown-right">
        <ul class="dropdown-right-col1">
          <li>TEST 4</li>
          <li>TEST 5</li>
          <li>TEST 6</li>
        </ul>
      </ul>
    </li>
  </ul>
</div>

＆＃13;

jQuery使用Next（）或Find（）在DOM中遍历

1 个答案: