使用目录树根据用户点击在网页上逐级显示文件夹

时间:2019-07-31 09:36:05

标签: python html flask directory-tree

我在python文件中制作了目录树(即,文件夹树,它的子文件夹和子文件夹的子文件夹等),我想将该树显示在我的网页上。因此,我将树发送到HTML文件。

<body>
    <ul id="myUL">
        <li><span class="caret">{{ tree.name }}</span>
          <ul class="nested">
            {%- for item in tree.children recursive %}
              <li>
            {%- if item.isDir -%}
                {{ item.name }}
            {%- else -%}
                <a href = "/home/show/{{role}}/{{item.path}}"> {{ item.name }}</a>
            {%- endif %}
              </li>
            {%- if item.children -%}
            <li><span class="caret">{{ item.children.name }}</span>
              <ul class="nested">
                {{loop(item.children)}}
              </ul>
            </li>
            {% endif %}
            {% endfor %}
        </ul>
        </li>
    </ul>

    <script>
        var toggler = document.getElementsByClassName("caret");
        var i;

        for (i = 0; i < toggler.length; i++) {
          toggler[i].addEventListener("click", function() {
            this.parentElement.querySelector(".nested").classList.toggle("active");
            this.classList.toggle("caret-down");
          });
        }
    </script>
</body>

我希望输出为 Main_Folder

,当我单击它时应显示 子文件夹1 子文件夹2

以此类推。

但是我得到的输出只是Main_Folder

0 个答案:

没有答案