Ich habe einen Ort, an dem ich versuche, Code in einem Textbereich anzuzeigen. Ich habe das Beispiel heruntergespielt, aber im Grunde kann der Benutzer einige Felder eingeben, auf eine Schaltfläche klicken und das Code-Snippet wird in einem Textbereich darunter angezeigt, damit sie es bearbeiten und dann kopieren können.

Ich habe es endlich geschafft, das eigentliche Code-Snippet anzuzeigen. Aber jetzt kann ich keinen Weg finden, es so zu formatieren, dass es eingerückt ist und gut aussieht.

var mySnippet =
"<div id=\"myOuterDiv\">"
    + "<div id=\"myInnerDiv\">"
    + "</div>"
    + "</div>";
$('#mySnippetArea').text(mySnippet);

Was in meinem Textbereich so angezeigt wird.

<div id="myOuterDiv"><div id="myInnerDiv"></div></div>

Wo wie ich es gerne sehen würde als:

    <div id="myOuterDiv">
        <div id="myInnerDiv">
        </div>
    </div>

Ich würde wirklich gerne Plugins von Drittanbietern meiden, da es für die Arbeit sehr schwierig ist, eine Genehmigung zu erhalten. Es sind nur 4 kleine Schnipsel, die ich formatieren muss.

AKTUALISIEREN Dies scheint so zu funktionieren, wie ich es brauche.

var mySnippet =
        "<div id=\"myOuterDiv\">\r"
            + "    <div id=\"myInnerDiv\">\r"
            + "    </div>\r"
            + "</div>\r";

Ausgabe:

<div id="myOuterDiv">
    <div id="myInnerDiv">
    </div>
</div>