0

私はこれを理解しようとしています、私はマルチレベルのシンプルなメニューツリーを構築しようとしています

RootFolder
- First Sub Folder
-- First Sub Sub Folder
--- First Sub Sub Sub Folder
--- First Sub Sub Sub Sub Folder
- Second Sub Folder
- Second Sub Sub Folder

私のXMLは非常に単純です(正しい値ではありません)

<OrgFolderDetails>
    <FolderName>Main Folder</FolderName>
    <TheChildren>
        <OrgFolderDetails>
            <FolderName>First Sub Folder</FolderName>
            <TheChildren>
                <OrgFolderDetails>
                    <FolderName>First Sub Sub Folder</FolderName>
                    <TheChildren>
                        <OrgFolderDetails>
                            <FolderName>First Sub Siub Sub Folder</FolderName>
                            <TheChildren>
                                <OrgFolderDetails>
                                    <FolderName>First Sub Sub Sub Sub Folder</FolderName>
                                    <TheChildren/>
                                </OrgFolderDetails>
                            </TheChildren>
                        </OrgFolderDetails>
                    </TheChildren>
                </OrgFolderDetails>
            </TheChildren>
        </OrgFolderDetails>
        <OrgFolderDetails>
            <FolderName>Second Sub Folder</FolderName>
            <TheChildren>
                <OrgFolderDetails>
                    <FolderName>Second Sub Sub Folder</FolderName>
                    <TheChildren/>
                </OrgFolderDetails>
            </TheChildren>
        </OrgFolderDetails>
    </TheChildren>
</OrgFolderDetails>

jQueryの.filter()とを使用しました。find()each()は成功せず、自分がどのレベルにいるかを示す良いダッシュを表示せず、フォルダ名を吐き出すだけです。

トラバースする私のコード

 $(data).find("FolderName").each(function(){
             var folderName = $(this).text();

            $("#folderLevels").append(folderName+"<br/>");
         });
4

2 に答える 2

1

さて、私が理解していることから、子供のレベルに応じて、特定の数のダッシュが先行するメニューを作成する必要があります。幸運なことに、jQueryはこれをちょっと簡単にします。

$(data).find("FolderName").each(function(){ 
    var levels = $(this).parents("OrgFolderDetails").size();
    var text = $(this).text();
    var html = "";

    for(var j=0; j < levels; j++){
        html += "-";    
    }
    html += " "+text+"</br>"; //add in that space after the dashes, and the <br>

    $("#folderLevels").append(html);
});

お役に立てば幸いです。これの主なヘルパーはparents()メソッドです。 http://api.jquery.com/parents

于 2012-05-23T03:21:46.690 に答える
0

これには再帰関数を使用することをお勧めします。

var s = getNestedString($(data), 0);

function getNestedString(d, level) {
    // get the name of current node
    var s = d.children("FolderName").text() + "<br/>";

    // prepend with dashes for inner levels
    for (var i=0 ; i<level ; i++) {
        s = "-" + s;
    }

    // get children and call this function recursively (incrementing level)
    var ch = d.children("TheChildren").children("OrgFolderDetails");
    for (var i=0 ; i < ch.length ; i++) {
        s = s + getNestedString(ch[i], level+1);
    }

    // return string for current and nested nodes
    return s;
}
于 2012-05-23T03:22:14.923 に答える