带有jquery文件树的asp.net mvc应用程序中的文件路径

Question

我试图掌握 jquery 文件树插件，但文件路径有问题。问题是，jquery 调用设置了一个根目录，如果它设置为“/”，我希望它成为我的服务器目录中的路径。所以我在 jquery 代码与之交互的服务器代码中设置了它。

这是 jquery 调用：

<script type="text/javascript">
    $(document).ready(function () {
        root: "/", //Have made sure that the HomeController makes this correspond to the server application path or subfolder.
        $('#result').fileTree({
            script: 'Home/JqueryFileTree',
            expandSpeed: 1000,
            collapseSpeed: 1000,
            multiFolder: false
        }, function (file) {
            alert(file); //This shows the name of the file if you click it
        });
    });
</script>

下面是我如何设置根“/”以对应于我的 Web 应用程序中的位置：

    if (Request.Form["dir"] == null || Request.Form["dir"].Length <= 0 || Request.Form["dir"] == "/")
        dir = Server.MapPath(Request.ApplicationPath); //Works but creates a strange mix of slashes and backslashes...
    else
        dir = Server.UrlDecode(Request.Form["dir"]);

只要让文件树显示正确的文件树，这效果很好。但问题是，当我单击一个文件，并在 jquery 中调用警报函数时，警报框显示的文件路径是 Windows 路径（上面指定为 root 的路径）和 url（路径的相对结束部分）。例如c：\我的文档\ Visual Studio \MvcApplication\FileArea/Public/file.txt。

如果我将服务器代码中的根指定为“/”，就像 jquery 文件树中的原始脚本示例中那样，我只会获得警报框中的最后一个相关部分。另外，在生成的文件树中，我得到了 c: 驱动器的根目录，而不是 Web 应用程序的根目录...但是现在，当我指定相对于我的 Web 应用程序的路径时，我得到了整个绝对路径的混合。

由于我希望能够获取此路径并对文件执行操作，因此我预计此路径将是一个问题。那么这里发生了什么，为什么路径会这样，我该如何修复它？我不知道如何在 jquery 中指定相对于我的 Web 应用程序的路径，因此在服务器代码中执行它是我唯一能想到的。无论如何，我想我无论如何都可以使用完整的绝对路径，只要我可以修复它以使其使用一种格式即可。但谁能告诉我怎么做？

编辑： 我想我也会发布实际的 jquery fileTree 代码，如果这有帮助的话：

// jQuery File Tree Plugin
//
// Version 1.01
//
// Cory S.N. LaViska
// A Beautiful Site (http://abeautifulsite.net/)
// 24 March 2008
//
// Visit http://abeautifulsite.net/notebook.php?article=58 for more information
//
// Usage: $('.fileTreeDemo').fileTree( options, callback )
//
// Options:  root           - root folder to display; default = /
//           script         - location of the serverside AJAX file to use; default = jqueryFileTree.php
//           folderEvent    - event to trigger expand/collapse; default = click
//           expandSpeed    - default = 500 (ms); use -1 for no animation
//           collapseSpeed  - default = 500 (ms); use -1 for no animation
//           expandEasing   - easing function to use on expand (optional)
//           collapseEasing - easing function to use on collapse (optional)
//           multiFolder    - whether or not to limit the browser to one subfolder at a time
//           loadMessage    - Message to display while initial tree loads (can be HTML)
//
// History:
//
// 1.01 - updated to work with foreign characters in directory/file names (12 April 2008)
// 1.00 - released (24 March 2008)
//
// TERMS OF USE
// 
// This plugin is dual-licensed under the GNU General Public License and the MIT License and
// is copyright 2008 A Beautiful Site, LLC.
//



if (jQuery) (function ($) {

    $.extend($.fn, {
        fileTree: function (o, h) {
            // Defaults
            if (!o) var o = {};
            if (o.root == undefined) o.root = '/';
            if (o.script == undefined) o.script = 'jqueryFileTree.php';
            if (o.folderEvent == undefined) o.folderEvent = 'click';
            if (o.expandSpeed == undefined) o.expandSpeed = 500;
            if (o.collapseSpeed == undefined) o.collapseSpeed = 500;
            if (o.expandEasing == undefined) o.expandEasing = null;
            if (o.collapseEasing == undefined) o.collapseEasing = null;
            if (o.multiFolder == undefined) o.multiFolder = true;
            if (o.loadMessage == undefined) o.loadMessage = 'Loading...';

            $(this).each(function () {

                function showTree(c, t) {
                    $(c).addClass('wait');
                    $(".jqueryFileTree.start").remove();
                    $.post(o.script, { dir: t }, function (data) {
                        $(c).find('.start').html('');
                        $(c).removeClass('wait').append(data);
                        if (o.root == t) $(c).find('UL:hidden').show(); else $(c).find('UL:hidden').slideDown({ duration: o.expandSpeed, easing: o.expandEasing });
                        bindTree(c);
                    });
                }

                function bindTree(t) {
                    $(t).find('LI A').bind(o.folderEvent, function () {
                        if ($(this).parent().hasClass('directory')) {
                            if ($(this).parent().hasClass('collapsed')) {
                                // Expand
                                if (!o.multiFolder) {
                                    $(this).parent().parent().find('UL').slideUp({ duration: o.collapseSpeed, easing: o.collapseEasing });
                                    $(this).parent().parent().find('LI.directory').removeClass('expanded').addClass('collapsed');
                                }
                                $(this).parent().find('UL').remove(); // cleanup
                                showTree($(this).parent(), escape($(this).attr('rel').match(/.*\//)));
                                $(this).parent().removeClass('collapsed').addClass('expanded');
                            } else {
                                // Collapse
                                $(this).parent().find('UL').slideUp({ duration: o.collapseSpeed, easing: o.collapseEasing });
                                $(this).parent().removeClass('expanded').addClass('collapsed');
                            }
                            h($(this).attr('rel')); //Testing how to get the folder name to display... Works fine.
                        } else {
                            h($(this).attr('rel')); //Calls the callback event in the calling method on the page, with the rel attr as parameter
                        }
                        return false;
                    });
                    // Prevent A from triggering the # on non-click events
                    if (o.folderEvent.toLowerCase != 'click') $(t).find('LI A').bind('click', function () { return false; });
                }
                //ASN: I think it starts here, the stuff before are just definitions that need to be called here.
                // Loading message
                $(this).html('<ul class="jqueryFileTree start"><li class="wait">' + o.loadMessage + '<li></ul>');
                // Get the initial file list
                showTree($(this), escape(o.root));
            });
        }
    });

})(jQuery);

所以，长话短说：我不明白文件路径在这里是如何工作的。仅指定“/”作为根似乎可以作为相对路径（因为警报框仅显示相对路径），但它为我提供了计算机根（c:）的文件树。那么我该如何使用它来使用我的 Web 应用程序的相对路径，并且仍然获得可以使用的正确路径呢？

任何帮助表示赞赏！