-1

我有一个这样的目录结构:

Root
 |
 |-Folder 1
 |   |
 |   |--Multiple files.
 |   |
 |   |--Folder 1.a
 |         |
 |-Files   |
           |----Multiple files.
           |----Further tree of more folder's and files.

它保存在 XML 文件中,如下所示:

<dir name="root">
 <dir name="Folder 1">
  <file name="file1"/>
  <file name="file2"/>
  <dir name="folder1.a>
   <file name="innerfile"/>
  </dir>
 </dir>
 <dir name="folder2">
  .... so on ....

我想使用 jQuery 遍历这棵树并打印使用缩进的目录结构,如下所示:

Root
  Folder1
   file1
   file2
   Folder1.a
    inner file
  Folder2
    file N
    folder N 
       .....

我使用的代码如下

   $(document).ready(function()
   {
     $.ajax({
       type: "GET",
       url: "root.xml",
       dataType: "xml",
       success: parseXml
     });
   });

   function parseXml(xml)
   {
    $(xml).find("directory").each(function(){
       $("#output").append("<a href = \"" + $(this).attr("absolutePath") + "\">" +                                                          $(this).attr("name") + "</a><br>");
       $(this).find("file").each(function()
       {
         $("#output").append("&nbsp;&nbsp;&nbsp;&nbsp;<a href = \"" + $(this).attr("absolutePath") + "\">" + $(this).attr("name") + "</a><br>");
       });
       $('#output').append("<br>");
     });

我的代码正在运行,但嵌套文件夹的文件是多余的,因为我多次打印子目录中的所有文件,我希望一个文件只列出一次,但不知道怎么可能???

4

1 回答 1

0

假设您可以获得您正在查看的节点的级别,您可以使用一系列 2 列表来执行此操作,其中每个表的第一个单元格是一个等于当前级别 * 您想要间隔的像素数的间隔通过,像这样:

$("output").append("<table><tr><td style=\"width: " + (myLevel * 12).ToString() + "px;\" /><td><a href = \"" + $(this).attr("absolutePath") + "\">" + ...

最终结果将如下所示:

<table><tr><td style="width: 0px;" /><td>Root</td></tr></table>
<table><tr><td style="width: 12px;" /><td>Folder1</td></tr></table>
<table><tr><td style="width: 24px;" /><td>file1</td></tr></table>
<table><tr><td style="width: 24px;" /><td>file2</td></tr></table>
<table><tr><td style="width: 24px;" /><td>Folder1.a</td></tr></table>
<table><tr><td style="width: 36px;" /><td>inner file</td></tr></table>
<table><tr><td style="width: 12px;" /><td>Folder2</td></tr></table>
<table><tr><td style="width: 24px;" /><td>filen</td></tr></table>
<table><tr><td style="width: 24px;" /><td>Folder1.n</td></tr></table>

抱歉,我对 xml 部分无能为力,但希望这会让您朝着正确的方向前进。

于 2013-02-25T19:57:48.033 回答