konvertieren verschachtelt ul li

Question

ul li Struktur

<ul id="sortable" class="sortable ui-sortable"> 
<li id="home" class="col-sm-12 col-lg-12 "><div>home <span data-name="home" class="delete">remove</span></div> 
    <ul> 
      <li id="about-us" class="col-sm-12 col-lg-12" style="position: relative; left: 0px; top: 0px;"><div>about-us <span data-name="about-us" class="delete">remove</span></div> 
       <ul> 
        <li id="product" class="col-sm-12 col-lg-12" style="position: relative; left: 0px; top: 0px;"><div>product <span data-name="product" class="delete">remove</span></div> </li> 
       </ul> 
      </li> 
    </ul> 
</li> 
<li id="carrer" class="col-sm-12 col-lg-12 "><div>carrer <span data-name="carrer" class="delete">remove</span></div> 
    <ul> 
     <li id="product" class="col-sm-12 col-lg-12" style="position: relative; left: 0px; top: 0px;"><div>product <span data-name="product" class="delete">remove</span></div></li> 
     <li id="about-us" class="col-sm-12 col-lg-12" style="position: relative; left: 0px; top: 0px;"><div>about-us <span data-name="about-us" class="delete">remove</span></div> 
      <ul> 
       <li id="home" class="col-sm-12 col-lg-12" style="position: relative; left: 0px; top: 0px;"><div>home <span data-name="home" class="delete">remove</span></div></li> 
      </ul> 
     </li> 
     <li id="product" class="col-sm-12 col-lg-12" style="position: relative; left: 0px; top: 0px;"><div>product <span data-name="product" class="delete">remove</span></div>   </li> 
    </ul> 
</li> 
    <li id="carrer" class="col-sm-12 col-lg-12 "><div>carrer <span data-name="carrer" class="delete">remove</span></div></li> 
    <li id="about-us" class="col-sm-12 col-lg-12 "><div>about-us <span data-name="about-us" class="delete">remove</span></div> 
     <ul> 
      <li id="product" class="col-sm-12 col-lg-12" style="position: relative; left: 0px; top: 0px;"><div>product <span data-name="product" class="delete">remove</span></div> </li> 
     </ul> 
    </li> 

Ich mag Json wie

{ "name" JSon: "home entfernen", "Kinder": [ { "Name": "über-uns entfernen", "Kinder": [{ "Name": "Produkt entfernen", "Kinder": [{}], }] }], "name": "Carrer entfernen", "Kinder": [{ "name": "Produkt entfernen", "Kinder": [{}], "name": " about-us entfernen " "Kinder": [{ "name": "home entfernen", "Kinder": [{}], }], "name": "Produkt entfernen", " Kinder ": [{}], }], " name ":" carrer remove ", " children ": [{}}, " name ":" about-us remove ", " children ": [{ "Name": "Produkt entfernen", "Kinder": [{}], }] }

Ich habe habe Code wie unten

function buildJSON($li) { 
    var subObj = { "name": $li.contents().eq(0).text().trim() }; 
    $li.children('ul').children().each(function() { 
    if (!subObj.children) { subObj.children = []; } 
    subObj.children.push(buildJSON($(this))); 
    }); 
    return subObj; 
} 

var obj = buildJSON($("#sortable").children()); 
$('#sortable').append('<pre>').find('pre').append(JSON.stringify(obj, null, 2)); 

heraus gesetzt seine etwas anderes

{ "name" : "home remove", "kinder": [ { "name": "über-uns entfernen", "kinder": [ { "name": "Produkt entfernen" } ] }, { "name": "Produkt entfernen" }, { "name": "about-us entfernen", "Kinder" [ { "name": "home entfernen" } ] }, { "name": "Produkt entfernen" }, { "name": "entfernen Produkt" } ] }

Einige Einträge fehlen ... mir bitte helfen, wo ich Code verpasst

Dank im Voraus

Answer 1

Sie wurden jeweils li nach Schleife über jedes Kinder von Eltern fehlt ul.

Und es wird kein einzelnes Objekt zurückgeben. Sie erhalten Daten im JSON-Array-Format.

Dies ist kompletter JS-Code.

function FetchChild(){ 
    var data =[]; 
     $('#sortable > li').each(function(){ 
      data.push(buildJSON($(this))); 
     }); 

     return data; 
    } 
    function buildJSON($li) { 
    var subObj = { "name": $li.contents().eq(0).text().trim() }; 
    $li.children('ul').children().each(function() { 
    if (!subObj.children) { 
     subObj.children = []; 
     } 
    subObj.children.push(buildJSON($(this))); 
    }); 
    return subObj; 
} 
var obj = FetchChild(); 
$('#sortable').append('<pre>').find('pre').append(JSON.stringify(obj, null, 2)); 

Fiddle Demo