根据当前页面URL打开特定的Jquery手风琴声像 [英] Open particular Jquery accordion pan based on current page URL

问题描述

我有一个Jquery accordion，手风琴有pan的，列表元素和列表元素中的锚标签，锚标签的href属性具有当前页面的URL. 我只希望在访问页面时自动打开一个特定的面板(包含该定位标记)，并且其列表元素应该处于活动状态.我有一些代码，它们在最后制作了手风琴和代码片段，从而制作了列表元素积极的.但是列表元素未处于活动状态，并且面板未打开.我想我很想念东西. 这是代码:

I have a Jquery accordion, accordion has pan's, list elements and anchor tags in list elements, href attributes of anchor tags have current page URL's. I just want that when a page is visited a particular panel (which contains that anchor tag) automatically opens and its list element should become active. I have code which make accordion and snippet in end which make list element active. But list element is not active and panel is not opened. I think I am missing something badly. Here is code:

<script>
  $.ajax({
    url: "/categories",
    type: 'GET',
    success: function(data) {
      var content = "";

      content += '<div id="category-navigation">';
      for (i = 0; i < data.length; i++) {

        content += '<div class="head">';
        content += '<label class="categoryLables">' + data[i].title;
        content += '</label>';

        content += '<div>';
        content += '<div class="boardsMargin">';
        content += '<ul>';

        for (j = 0; j < data[i].assigned_boards.length; j++) {

          content += '<li>';
          content += "<a href='/#categories/" + data[i].id + "/boards/" + data[i].assigned_boards[j].id + "'>";
          content += data[i].assigned_boards[j].name;
          content += '</a>';
          content += '</li>';
        }

        content += '</ul>';
        content += '</div>';
        content += '</div>';
        content += '</div>';
      }
      content += '</div>';

      $("#myNavigation").html("");
      $("#myNavigation").html(content);

      $('.head').accordion({
        heightStyle: "content",
        active: true,
        collapsible: true
      });

      $('.head li').each(function() {
        li = $(this);
        a = $('a', li);

        myUrl = "";

        myUrl += (location.protocol + "//" + location.hostname +
          (location.port && ":" + location.port));
        myUrl += (a.attr('href'));


        if (myUrl == window.location.href) {
          console.log(myUrl);
          console.log(window.location.href);
          li.addClass('active');

        }
      });

    }

  });

</script>

简短演示

我的问题与此

My question is quite similar to this question. And I am following its 1st answer.

为更清楚地看到，这是我的手风琴的图片.

For more clear view, this is picture of my accordion.

作为旁注:我正在使用ruby 2.2.1和rails 4.1

As a side note: I am working in ruby 2.2.1 and rails 4.1

推荐答案

此代码应能解决问题:

$(document).find("a[href*='" + '/' + window.location.pathname + "']").parents(".head").find("h3").trigger("click");

示例代码放置位置

这篇关于根据当前页面URL打开特定的Jquery手风琴声像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！