为什么我的带有“$(this).next”的 JavaScript/jQuery 脚本不起作用？

Question

在“nopCommerce”中，我想更改侧分类导航。

现在，当有人点击一个类别时，它会被展开......但它不起作用。

HTML 看起来像这样：

（...）

$(document).ready(function() {
  $('.dropdown').on('click', function() {
    var $this = $(this)
    $this.next('a.dropdown-toggle').attr('aria-expanded', 'true');
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class=master-column-wrapper>
  <div class=container>
    <div class=row>
      <div class="sidebar col-md-3">
        <div class="block block-category-navigation well box-shadow-wrapper">
          <div class="wjktitle main-title"><strong>Kategorien</strong></div>
          <div class="wjklistbox MainMenu">
            <ul class="nav nav-list">
              <li><a href=/de/gift-cards-2> Gift Cards <span class="head-number op-number"> (0) </span> <span>&nbsp;</span> </a>
                <li class=dropdown>
                  <span class="fa fa-angle-down visible-xs"></span>
                  <a class=dropdown-toggle href=/de/pickup role=button aria-expanded=false> Pickup (2) </a>
                  <ul class="dropdown-menu sub-menusublist first-level" role=menu>
                    <li><a href=/de/opel> Opel <span class="head-number op-number"> (0) </span> <span>&nbsp;</span> </a>
                      <li><a href=/de/toyota> Toyota <span class="head-number op-number"> (0) </span> <span>&nbsp;</span> </a>
                        <li><a href=/de/ford> Ford <span class="head-number op-number"> (0) </span> <span>&nbsp;</span> </a>
                          <li class=dropdown><span class="fa fa-angle-down visible-xs"></span> <a class=dropdown-toggle href=/de/vw role=button aria-expanded=false> VW (2) </a>
                            <ul class="dropdown-menu sub-menusublist first-level" role=menu>
                              <li class=dropdown><span class="fa fa-angle-down visible-xs"></span> <a class=dropdown-toggle href=/de/bully role=button aria-expanded=false> Bully (2) </a>
                                <ul class="dropdown-menu sub-menusublist first-level" role=menu>
                                  <li><a href=/de/2010-> 2010- <span class="head-number op-number"> (0) </span> <span>&nbsp;</span> </a>
                                    <li class=dropdown><span class="fa fa-angle-down visible-xs"></span> <a class=dropdown-toggle href=/de/2015- role=button aria-expanded=false> 2015- (2) </a>
                                      <ul class="dropdown-menu sub-menusublist first-level" role=menu>
                                        <li><a href=/de/lampen> Lampen <span class="head-number op-number"> (2) </span> <span>&nbsp;</span> </a>
                                          <li><a href=/de/kotflugel> Kotfl&#xFC;gel <span class="head-number op-number"> (0) </span> <span>&nbsp;</span> </a>
                                      </ul>
                                </ul>
                                <li class=dropdown><span class="fa fa-angle-down visible-xs"></span> <a class=dropdown-toggle href=/de/golf role=button aria-expanded=false> Golf (0) </a>
                                  <ul class="dropdown-menu sub-menusublist first-level" role=menu>
                                    <li class=dropdown><span class="fa fa-angle-down visible-xs"></span> <a class=dropdown-toggle href=/de/2015--2 role=button aria-expanded=false> 2015- (0) </a>
                                      <ul class="dropdown-menu sub-menusublist first-level" role=menu>
                                        <li><a href=/de/lampen-2> Lampen <span class="head-number op-number"> (0) </span> <span>&nbsp;</span> </a>
                                          <li><a href=/de/kotflugel-2> Kotfl&#xFC;gel <span class="head-number op-number"> (0) </span> <span>&nbsp;</span> </a></ul>
                                      <li><a href=/de/2010--2> 2010- <span class="head-number op-number"> (0) </span> <span>&nbsp;</span> </a></ul>
                            </ul>
                  </ul>
                  <li><a href=/de/svu> SVU <span class="head-number op-number"> (0) </span> <span>&nbsp;</span> </a></ul>
          </div>
        </div>

Answer 1

a.dropdown-toggle

是

.dropdown

的孩子，所以您可以调用

next

方法代替

find

：

$(document).ready(function() {
  $('.dropdown').on('click', function() {
    var $this = $(this)
    $this.find('a.dropdown-toggle').attr('aria-expanded', 'true');
  });
});