Jquery onClick,循环通过div并切换目录探索目的

时间:2016-12-24 08:18:15

标签: jquery onclick each

我基本上使用自定义界面来显示和隐藏目录树中的项目。 id仅在其文件夹时分配给元素,并且所有文件夹内容(其他元素)的名称都等于父级的id。现在show hide作为研究员:

$(".directory-item").click(function () {
    $('div[name=' + this.id + ']').toggle();
});

除非现在我需要在点击时折叠子文件夹或子文件夹,否则效果很好。所以代码必须是这样的:

$(".directory-item").click(function () {
    $('div[name=' + this.id + ']').toggle();
    $('div[name=' + this.id + ']').each(function(){
         var each_id = this.id; //NEW ID FROM .each NOT .click
         $('div[name=' + each_id + ']').toggle();
    });
});

当然,这并不能说明所需的递归。简而言之,扩展文件夹很棒......但如果你收缩一个打开子文件夹的文件夹,它们就会保持打开状态。

HTML /剃刀:

        <div class="folder-explorer">
            @{ 
                var parentFolder = "";
            }
            @for (int i = 0; i < ViewBag.fullHierarchy.Count; i++) {
                var item = ViewBag.fullHierarchy[i];
                //Set Previous item when applicable
                int indent_level = (item.Level - 1) * 25 + 10;
                string display = "";
                string item_type = item.Type;
                string icon_type = "";
                var item_name = "";
                var item_id = "";

                //Set item visibility
                if (item.Level == 1) {
                    display = "block";
                }
                else {
                    display = "none";
                }
                //Set item icon
                if (item_type == "folder") {
                    icon_type = "fa-folder";
                }
                else {
                    icon_type = "fa-file";
                }

                //Always assign ID, only if its a folder
                if (item_type == "folder") {
                    item_id = item.ItemName;
                }else {
                    item_id = "";
                }

                //Set item name to parent folder
                if (item.Level > 1) {
                    var previous_item = ViewBag.fullHierarchy[i - 1];
                    item_name = item.Parent;
                    if (item.Level > previous_item.Level) {
                        @:<div name="@item_name">
                    }
                    else if (item.Level < ViewBag.fullHierarchy.Count) {
                        var next_item = ViewBag.fullHierarchy[i + 1];
                        if (item.Level < next_item.Level) {
                            @:</div>
                        }
                    }
                }

                <div class="directory-item" id="@item_id" name="" style="padding-left: @(indent_level)px;  display: @(display)">
                    <i class="fa @icon_type"></i>
                    @item.ItemName (id: @item_id, name: @item_name, level: @item.Level)
                    <i class="fa  fa-angle-right float-right"></i>
                </div>
            }
        </div>

控制器:为简洁而排除,只需将内容分配给视图包

型号:

public void FullDirList(DirectoryInfo d) {
    count_hierarchy += 1;

    int directory_level = count_hierarchy;
    // Console.WriteLine("Directory {0}", dir.FullName);
    // list the files
    try {
        foreach (FileInfo f in d.GetFiles()) {
            //Console.WriteLine("File {0}", f.FullName);
            files.Add(f);
            HierarchyItem file = new HierarchyItem();
            file.ItemName = f.Name;
            file.Type = "file";
            file.Level = directory_level;
            var dirName = new DirectoryInfo(f.Directory.ToString()).Name;
            file.Parent = dirName.ToString();
            fullHierarchy.Add(file);
        }
    }
    catch {
        Console.WriteLine("Directory {0}  \n could not be accessed!!!!", d.FullName);
        return;  // We alredy got an error trying to access dir so dont try to access it again
    }

    // process each directory
    // If I have been able to see the files in the directory I should also be able 
    // to look at its directories so I dont think I should place this in a try catch block
    foreach (DirectoryInfo e in d.GetDirectories()) {
        folders.Add(e);
        HierarchyItem file = new HierarchyItem();
        file.ItemName = e.Name;
        file.Type = "folder";
        file.Level = directory_level;
        file.Parent = e.Parent.ToString();
        fullHierarchy.Add(file);
        FullDirList(e);
    }
    count_hierarchy -= 1;

}

我真正想做的事情:onclick,show / hide next level。它本质上是一个目录浏览器。我让它为扩展而努力,但是当我点击雇用者时,子级别不会崩溃,所以我决定尝试将每组孩子包裹在一个以其父母命名的div中...但这并不是似乎很容易。

0 个答案:

没有答案