Sortierung der Farben mit jquery

Ich habe ein Farbraster mit 1 Zeile erstellt. Nun möchte ich meine Farben im Raster sortiert nach dieser Reihenfolge "blau", "rot", "grün", "gelb", " orange "," pink "," braun "," schwarz " mit jquery.Ist es möglich ??? Html:Sortierung der Farben mit jquery

<body style="background-color:#663366"> 
<div class="form-group" > 
<div class="col-sm-5"> 

<table border="5px" width="500px" height="50px" align="center"> 
<tr id="colors"> 
<td height="50px" bgcolor="red"></td> 
<td height="50px" bgcolor="brown"></td> 

<td height="50px" bgcolor="pink" ></td> 
<td height="50px" bgcolor="blue" ></td> 

<td height="50px" bgcolor="black"></td> 
<td height="50px" bgcolor="green"></td> 

<td height="50px" bgcolor="orange" ></td> 
<td height="50px" bgcolor="yellow"></td> 

</tr> 
</table> 

</div> 
</div> 


</body>

Hier ist die Geige: https://jsfiddle.net/n6msyp8m/2/

Quelle

2016-04-03 Preethi

'' Elemente zwischen '' und '' sind eine schlechte Idee. Abgesehen davon, haben Sie versucht, ein benutzerdefiniertes Sortierprädikat an eines der zahlreichen verfügbaren Elementsorter-Plugins zu übergeben? –

Ich habe keine Ahnung, wie man diese benutzt! – Preethi

Dann ist es zu früh für Sie, hier zu posten, fürchte ich. Bitte versuchen Sie, sich durch die verschiedenen Dokumentationen zu kämpfen, holen Sie sich einen Prototyp, und kommen Sie zurück und fragen Sie, wenn Sie nicht weiterkommen. –

Beispiel:https://jsfiddle.net/n6msyp8m/4/

HTML:

<table border="5px" width="500px" height="50px" align="center"> 
    <tr id="colors"> 
    <td height="50px" orderId="1" bgcolor="red"></td> 
    <td height="50px" orderId="6" bgcolor="brown"></td> 

    <td height="50px" orderId="5" bgcolor="pink" ></td> 
    <td height="50px" orderId="0" bgcolor="blue" ></td> 

    <td height="50px" orderId="7" bgcolor="black"></td> 
    <td height="50px" orderId="2" bgcolor="green"></td> 

    <td height="50px" orderId="4" bgcolor="orange" ></td> 
    <td height="50px" orderId="3" bgcolor="yellow"></td> 
    </tr> 
</table>

JQuery:

$('tr#colors td').each(function(i){ 
    var elem=$('td[orderId="'+i+'"]'); 
    elem.remove(); 
    $('tr#colors').append(elem); 
});

Quelle

2016-04-03 17:39:55

Ja, es funktioniert Danke !!! Können Sie mir einfach sagen, wie Sie die sortierten Farbnamen zusammen mit Ihrem Code in einem Array speichern? – Preethi

@Preethi können Sie verwenden **. Map() ** Methode ** überprüfen Sie dies: ** https://jsfiddle.net/n6msyp8m/5/ –

Vielen Dank! Aber meine Idee ist nicht, die sortierten Farben anzuzeigen, sondern mein Farbraster bleibt gleich und diese Farbnamen werden sortiert und in einem Array gespeichert. Und dann, wie Sie gesagt haben, kann ich map() verwenden. – Preethi

Sortierung der Farben mit jquery

Antwort

Verwandte Themen