Question

我有一个多级列表：

<ul id="tree">
 <li><a href="#">A.</a>
<ul>
  <li><a href="#">Activist</a></li>
  <li><a href="#">Advertising</a>
    <ul>
      <li><a href="#">code</a></li>
      <li><a href="#">theme</a></li>
    </ul>
  </li>
  <li><a href="#">Algeria</a>
    <ul>
      <li><a href="#">forest</a></li>
      <li><a href="#">3.1</a>
        <ul>
          <li><a href="#">canyon</a></li>
          <li><a href="#">forest</a></li>
          <li><a href="#">river</a></li>
        </ul>
      </li>
      <li><a href="#">3.2</a>
        <ul>
          <li><a href="#">cc</a></li>
          <li><a href="#">4.1</a>
            <ul>
              <li><a href="#">5.1</a></li>
              <li><a href="#">5.2</a>
                <ul>
                  <li><a href="#">6.1</a></li>
                </ul>
              </li>
            </ul>
          </li>
          <li><a href="#">bcc</a></li>
          <li><a href="#">acc</a></li>
        </ul>
      </li>
    </ul>
  </li>
  <li><a href="#">American Samoa</a></li>
</ul>
</li>
<li><a href="#">B.</a>
<ul>
  <li><a href="#">Back Stabbing</a></li>
  <li><a href="#">Bad</a></li>
</ul>

我正在使用explr-js插件来创建资源管理器树，如下所示：

like this

如果展开另一个列表项，我想要的是自动折叠列表。目前，我有此代码

$(document).ready(function() {
  $('#tree > li').click(function() {
    $('li').not(this).children('ul').hide('fast');
  });
});

not auto-collapsing

此代码仅适用于我的主要li的第一级ul子级，不适用于其他级别。我想将此应用到列表的每个级别。

我该怎么做？

Answer 1

如果您使用插件，则应按照其说明进行折叠

您将startcollapsed设置为true吗？

Name, Kubernetes URL, Kubernetes server certificate key, ...

如果要在其他分支打开时自动关闭，则应重写插件源代码，或使用具有此选项的其他插件。也许可以使用此代码！

$('.explr').explr({
    startCollapsed : true,
    treeHeight : 200,
    treeWidth : 400
});

Answer 2

此代码仅适用于我主要ul的第一级li子级，不适用于其他级别

这是因为，您仅定位列表的第一级，如果要定位其他级别，则可以执行以下操作：

NotifManager.notify(1, summaryNotification) //id == 1

或

sharedPreferences

当使用jQuery扩展另一个列表项时，如何自动折叠所有列表项？

2 个答案: