Javascript La fonction récursive semble sortir après le premier passage

Question

J'essaye de rendre une arborescence comme la hiérarchie tout en récurant à travers un ensemble de noeuds (index). Je connais déjà les racines (top). Il y a plusieurs éléments racines. Je suis en train de recueillir le code html entier dans la variable arbre (ce html entier sera ajoutée à un div plus tard)

tree = ""; 
top = ["1", "11", "14", "17", "72", "73", "74", "78", "79", "98", "99"]; 
index = { 
    1: { 
     'name': "Node 1", 
     'children': "2,3,4,5,6,7,8,9,10" 
    }, 
    2: { 
     'name': "Node 2", 
     'children': "" 
    }, 

//.... goes all the way upto 99 
} 

La fonction récursive makeFT (index, racines) ne semble briser après avoir traversé les enfants du premier élément dans le tableau "top".

Le code pour ceci est à jsbin et ci-dessous. Quel pourrait être le problème? Y a-t-il une meilleure manière de faire cela? Toute aide est appréciée.

makeFT(index, top); 


function makeFT(index, roots) { 
    console.log(roots); 
    tree == "" ? tree += '<ul>' : tree += '<ul><hr/>' 
    for (i = 0; i < roots.length; ++i) { 
     n = parseInt(roots[i]); 
     //console.log(n); 
     //console.log(index[n]); 

     tree += '<li>' + roots[i] + '</span>' + index[n].name; 

     if (index[n].children === "") { 
      tree += '<input class="leaf tree-first-input" type="text" size="2">' 
     } 
     else { 
      tree += '<input class="non-leaf tree-first-input" type="text" size="2">' 
      makeFT(index, index[n].children.split(",")); 
     } 
     tree += "</li>" 
    } 
    tree += '</ul><br/>' 

} 

MISE À JOUR: Il s'avère qu'il s'agit d'un problème de portée et non de récurrence. La récursivité était correcte. Comme je ne définissais pas la portée de la variable 'i' en bouclant dans le tableau roots, chaque fonction récursive suivante héritait de la valeur de 'i' non bouclée créant ainsi le problème.

Answer 1

Ajoutez un var i = 0 dans la fonction. Vous avez des problèmes de portée avec i.

http://jsbin.com/ugoju4/12/edit

Answer 2

Vous ne renvoyez rien de votre fonction récursive.

} 
     else { 
      tree += '<input class="non-leaf tree-first-input" type="text" size="2">' 
      tree += makeFT(index, index[n].children.split(",")); 
     } 
     tree += "</li>" 
    } 
    tree += '</ul><br/>' 
    return tree; 
} 

Cela devrait vous donner la valeur. Utilisez-le pour l'écrire dans un élément par Id. Mise à jour du fichier jsfiddle

Answer 3

1. Pourquoi vous tapez "++ i" dans votre instruction for? Utilisez "i ++"

2. Vous tapez

   index

   [n] .children === ""

essayer avec

index[n].children == "" 

Je pense qu'il ne manque jamais dans la autre partie.

Answer 4

top est une variable globale faisant référence à la fenêtre "top" de l'ensemble courant de cadre. Utilisez un nom de variable différent.