Bestellliste alphabetisch

Question

Ich habe eine Frage. Ich muss ein Javascript erstellen, um eine ungeordnete Liste alphabetisch zu sortieren.

$(function() { 
    var $list = $(document.getElementsByClassName("list")); 
    $list.children().detach().sort(function (a, b) { 
     return $(a).text().localeCompare($(b).text()); 
    }).appendTo($list); 
}); 

, in der Kunden-Design jedoch gibt es ein paar Punkte auf diesen Listen sind die anderen Artikel der „Kind“ sind, mit dem folgenden Setup: Ich habe dies mit der folgenden Funktion erreicht

<ul> 
    <li>alpha</li> 
    <li>gama</li> 
    <li>beta</li> 
    <li style="margin-right: 5px;">beta1</li> 
</ul> 

Auf dem Code sind alle Elemente in der gleichen Liste, für den Benutzer ist "beta1" jedoch ein wenig nach rechts, und wenn er mit anderen Stilen kombiniert wird, sieht es so aus, als wäre es ein untergeordnetes Element.

Mit meiner obigen Funktion werden alle Artikel sortiert. Mit anderen Worten, "beta1" wird zusammen mit den "Eltern" sortiert.

Ich habe ein paar Dinge ohne Erfolg versucht, also hat jemand eine Idee, wie kann ich das erreichen? d. h. meine Funktion muss prüfen, ob ein Listenelement einen Stil angewendet hat, wenn ja, wird es an das vorherige Listenelement angehängt und als Eins angeordnet.

Danke!

Answer 1

Wie ändern Sie Ihre Listenstruktur, um die untergeordnete Liste aufzunehmen, und fügen Sie dann einen Stil für untergeordnete Listen hinzu.

<ul> 
    <li>alpha</li> 
    <li>gama</li> 
    <li>beta 
    <ul> 
     <li>beta1</li> 
    </ul> 
    </li> 
</ul> 

CSS:

li ul { 
    margin-right: 5px; 
}