将类添加到preparrent元素

时间:2017-12-01 04:09:46

标签: javascript jquery

请告诉我如何在前一个元素中添加一个类。例如:



function menu_js() {
  if (menu_ul.length > 0) {
    menu_ul.hide();
    menu_a.click(function(e) {
      e.preventDefault();
      if (!$(this).hasClass('active')) {
        menu_a.removeClass('active');
        menu_ul.filter(':visible').slideUp('normal');
        $(this).addClass('active').next().stop(true, true).slideDown('normal');
      } else {
        $(this).removeClass('active');
        $(this).next().stop(true, true).slideUp('normal');
      }
    });

    if (menu_current.length > 0) {
      if (menu_current.parent().attr('id') != "menu_mob") {
        menu_current.parent().show();
        menu_current.parent().parent().addClass('activeLi');
      } else {
        menu_current.addClass('activeLi');
      }
    }
  }
}

var menu_ul = $('#main .liste-produits'),
  menu_a = $('#main .categories-item'),
  menu_current = $('#main .current'),
  menu_ul_first = $('#main .liste-categories li:first-child .liste-produits'),
  menu_parent_open = $('#main .liste-categories li:first-child .categories-item');

menu_js();

$(document).ready(function() {
  var url = window.location;
  var element = $('ul.liste-produits a').filter(function() {
    return this.href == url || url.href.indexOf(this.href) == 0;
  });
  $(element).parentsUntil('ul.sidebar-menu', 'li').addClass('active');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<nav id="main" class="menu_boutique-area">
  <ul class="liste-categories">


    <li><strong class="categories-item"><a><em class="fa fa-chevron-circle-right">&nbsp;&nbsp;</em> Catalog 1 </a></strong>
      <ul class="liste-produits">
        <li><a href="/catalog1/subcat1.html" class="produit-item"><em class="fa fa-chevron-circle-right">&nbsp;&nbsp;</em> Subcat 1</a></li>
        <li><a href="/catalog1/subcat2.html" class="produit-item"><em class="fa fa-chevron-circle-right">&nbsp;&nbsp;</em> Subcat 2</a></li>
        <li><a href="/catalog1/subcat3.html" class="produit-item"><em class="fa fa-chevron-circle-right">&nbsp;&nbsp;</em> Subcat 3</a></li>
      </ul>
    </li>


    <li><strong class="categories-item"><a><em class="fa fa-chevron-circle-right">&nbsp;&nbsp;</em> Catalog 2 </a></strong>
      <ul class="liste-produits">
        <li><a href="/catalog2/subcat1.html" class="produit-item"><em class="fa fa-chevron-circle-right">&nbsp;&nbsp;</em> Subcat 1</a></li>
        <li><a href="/catalog2/subcat2.html" class="produit-item"><em class="fa fa-chevron-circle-right">&nbsp;&nbsp;</em> Subcat 2</a></li>
        <li><a href="/catalog2/subcat3.html" class="produit-item"><em class="fa fa-chevron-circle-right">&nbsp;&nbsp;</em> Subcat 3</a></li>
      </ul>
    </li>


    <li><strong class="categories-item"><a><em class="fa fa-chevron-circle-right">&nbsp;&nbsp;</em> Catalog 3 </a></strong>
      <ul class="liste-produits">
        <li><a href="/catalog3/subcat1.html" class="produit-item"><em class="fa fa-chevron-circle-right">&nbsp;&nbsp;</em> Subcat 1</a></li>
        <li><a href="/catalog3/subcat2.html" class="produit-item"><em class="fa fa-chevron-circle-right">&nbsp;&nbsp;</em> Subcat 2</a></li>
        <li><a href="/catalog3/subcat3.html" class="produit-item"><em class="fa fa-chevron-circle-right">&nbsp;&nbsp;</em> Subcat 3</a></li>
      </ul>
    </li>


  </ul>
</nav>
&#13;
&#13;
&#13;

使用var url = window.location;我在active元素添加类时,定义用户在哪个页面添加到菜单中的项ul.liste-categories li。我需要为上面的项添加相同的类。

实际上,它应该像这样工作:菜单确定哪个页面是这个,并部署子项位于页面所在的项目。

我对Javascript不好,但据我所知,只需要将active类添加到主要项目中。

0 个答案:

没有答案