Question

Mates，在努力实现一个类来枚举文件系统树如何放弃triyng以使其工作之后很难。

我有一个带文件路径的文本框。我希望用户能够单击显示文件系统树的面板，然后单击并选择路径。

你们可以帮助我。

只是为了你明白我在做什么，这就是代码：

try
{
    DriveInfo[] allDrives = DriveInfo.GetDrives();

    Response.Write("<ul class=\"jqueryFileTree\" style=\"display: none;\">\n");

    foreach (DriveInfo drive in allDrives)
    {
        if (drive.IsReady == true)
        {
            try
            {
                Response.Write("\t<li class=\"drive collapsed\"><a href=\"#\" rel=\"" + drive.ToString() + "\">" + drive.ToString() + "</a>\n");

                System.IO.DirectoryInfo di = new System.IO.DirectoryInfo(drive.ToString());
                DirectoryInfo[] directories = di.GetDirectories("*.*", SearchOption.AllDirectories);

                Response.Write("<ul>");

                foreach (System.IO.DirectoryInfo di_child in directories)
                {
                    Response.Write("\t<li class=\"directory collapsed\"><a href=\"#\" rel=\"" + drive + di_child.Name + "/\">" + di_child.Name + "</a>\n");
                    Response.Write("<ul>");

                    foreach (System.IO.FileInfo fi in di.GetFiles())
                    {
                        string ext = "";
                        if (fi.Extension.Length > 1)
                        {
                            ext = fi.Extension.Substring(1).ToLower();
                        }

                        Response.Write("\t<li class=\"file ext_" + ext + "\"><a href=\"#\" rel=\"" + drive + fi.Name + "\">" + fi.Name + "</a></li>\n");
                    }
                    Response.Write("</ul></li>");
                }
                Response.Write("</ul></li>");
            }
            catch (UnauthorizedAccessException e)
            {
                Response.Write(e.Message);
                continue;
            }
            catch (System.IO.DirectoryNotFoundException e)
            {
                Response.Write(e.Message);
                continue;
            }
            catch (Exception e)
            {
                Response.Write(e.Message);
                continue;
            }
        }
    }

    Response.Write("</ul>");
}
catch (Exception)
{
    throw;
}

Answer 1

jqueryFileTree的文档说明您需要一个带有名为dir的POST参数的函数，并且您的页面应返回表单的无序列表（ul）：

<ul class="jqueryFileTree" style="display: none;">
    <li class="directory collapsed"><a href="#" rel="/this/folder/">Folder Name</a></li>
    (additional folders here)
    <li class="file ext_txt"><a href="#" rel="/this/folder/filename.txt">filename.txt</a></li>
    (additional files here)
</ul>

如果您遵循这些说明，您基本上将需要2个页面：一个完全专门用于生成上面的输出，另一个页面用于托管jQueryFileTree插件所需的jQuery库。

例如，您需要一个Default.aspx，其标记类似于：

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
     <script src="http://labs.abeautifulsite.net/archived/jquery-fileTree/demo/jquery.js" type="text/javascript"></script>
    <script src="http://labs.abeautifulsite.net/archived/jquery-fileTree/demo/jquery.easing.js" type="text/javascript"></script>
    <script src="http://labs.abeautifulsite.net/archived/jquery-fileTree/demo/jqueryFileTree.js" type="text/javascript"></script>
    <link href="http://labs.abeautifulsite.net/archived/jquery-fileTree/demo/jqueryFileTree.css" rel="stylesheet" type="text/css" media="screen" />
    <script type="text/javascript">
        $(document).ready(function () {
            $.post('FileTree.aspx',{dir:'c:\\'}, function (data) {
                $('#filetree').html(data);
                $('.jqueryFileTree').fileTree({ root:'/' ,script: 'FileTree.aspx' }, function (file) {
                    alert(file);
                });
            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div id="filetree">

    </div>
    </form>
</body>
</html>

在document.ready上的位置，您向名为post的页面发送FileTree.aspx个请求，该页面实际上会生成所需ul>li正确样式的代码作为目录和文件。

FileTree.aspx页面应该是完全空的，但后面的代码应该是这样的：

protected void Page_Load(object sender, EventArgs e)
    {
        if (Request.Params["dir"] != null)
        {
            System.IO.DirectoryInfo di = new System.IO.DirectoryInfo(Path.Combine("c:\\", Request.Params["dir"]));
            if (di.Exists)
            {
                DirectoryInfo[] directories = di.GetDirectories("*.*", SearchOption.TopDirectoryOnly);
                Response.Write("<ul class=\"jqueryFileTree\" >\n");
                //Itera sobre os subdiretórios de cada driver
                foreach (System.IO.DirectoryInfo di_child in directories)
                {
                    Response.Write("\t<li class=\"directory collapsed\"><a href=\"#\" rel=\"" + di_child.Name + "/\">" + di_child.Name + "</a>\n");
                }
                foreach (System.IO.FileInfo fi in di.GetFiles())
                {
                    string ext = "";
                    if (fi.Extension.Length > 1)
                    {
                        ext = fi.Extension.Substring(1).ToLower();
                    }

                    Response.Write("\t<li class=\"file ext_" + ext + "\"><a href=\"#\" rel=\"" + fi.Name + "\">" + fi.Name + "</a></li>\n");
                }// Arquivos 
                Response.Write("</ul></li>");
            }
        }
    }

最后发生的事情是，在加载Default.aspx页面时，您向FileTree.aspx发送ajax请求作为参数传递根文件夹（我的示例中为c:\\）并在进一步点击任何呈现的文件夹，jQueryFileTree将继续向FileTree.aspx发送ajax发布请求，并选择目录名称。

在我的特定实现中，产生的输出如下：

enter image description here

现在，请记住，上述代码仅在您的Web应用程序在具有足够权限的用户下运行时才能运行，而默认情况下不是这种情况。您需要为此配置IIS。

另请注意，上述代码已从原始版本进行了大量修改。我这样做是因为你试图加载整个文件系统，这是一个非常漫长的loooooooong操作。您通常希望加载顶级目录，并且仅在单击每个目录时，然后尝试加载其内容。不要试图一次加载所有内容，也不要让任何人想要使用你的应用程序。

无论如何，我希望这能指出你正确的方向......

Answer 2

为什么不使用现有解决方案之一： http://www.ajaxline.com/best-javascript-tree-widgets？

如何向用户显示文件系统树，以便能够单击并选择路径？

2 个答案: