Nouvelle ligne dans la zone de texte

<textarea cols='60' rows='8'>This is my statement one.\n This is my statement2</textarea>

<textarea cols='60' rows='8'>This is my statement one.<br/> This is my statement2</textarea>

J'ai essayé les deux mais la nouvelle ligne ne se reflète pas lors du rendu du fichier html. Comment puis je faire ça?

Essaye celui-là:

    <textarea cols='60' rows='8'>This is my statement one.&#13;&#10;This is my statement2</textarea>


Le saut de ligne et le 
retour chariot sont des entités HTML ^wikipedia . De cette façon, vous analysez réellement la nouvelle ligne ("\ n") plutôt que de l'afficher sous forme de texte.

J'ai trouvé String.fromCharCode(13, 10)utile lors de l'utilisation de moteurs de vue. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/fromCharCode

Cela crée une chaîne contenant les caractères de nouvelle ligne réels et force ainsi le moteur de vue à générer une nouvelle ligne plutôt qu'une version d'échappement. Par exemple: Utilisation du moteur de vue NodeJS EJS - Ceci est un exemple simple dans lequel tout \ n doit être remplacé:

viewHelper.js

exports.replaceNewline = function(input) {
    var newline = String.fromCharCode(13, 10);
    return input.replaceAll('\\n', newline);
}

EJS

<textarea><%- viewHelper.replaceNewline("Blah\nblah\nblah") %></textarea>

Rendu

<textarea>Blah
blah
blah</textarea>

remplace tout:

String.prototype.replaceAll = function (find, replace) {
    var result = this;
    do {
        var split = result.split(find);
        result = split.join(replace);
    } while (split.length > 1);
    return result;
};

<textarea cols='60' rows='8'>This is my statement one.

This is my statement2</textarea>

Fiddle montrant que cela fonctionne: http://jsfiddle.net/trott/5vu28/ .

Si vous voulez vraiment que cela soit sur une seule ligne dans le fichier source, vous pouvez insérer les références de caractères HTML pour un saut de ligne et un retour chariot comme indiqué dans la réponse de @Bakudan:

  <textarea cols='60' rows='8'>This is my statement one.&#13;&#10;This is my statement2</textarea>

Je pense que vous confondez la syntaxe de différentes langues.

• 
est (la valeur HtmlEncoded de ASCII 10 ou) le littéral de caractère de saut de ligne dans une chaîne HTML . Mais le caractère de saut de ligne ne s'affiche PAS comme un saut de ligne en HTML (voir les notes en bas).

• \nest le littéral de caractère de saut de ligne (ASCII 10) dans une chaîne Javascript .

• <br/>est un saut de ligne en HTML. De nombreux autres éléments, par exemple <p>, <div>etc. rendent également les sauts de ligne, sauf s'ils sont remplacés par certains styles.

Espérons que l' illustration suivante le rendra plus clair:

T.innerText = "Position of LF: " + t.value.indexOf("\n");

p1.innerHTML = t.value;
p2.innerHTML = t.value.replace("\n", "<br/>");
p3.innerText = t.value.replace("\n", "<br/>");

<textarea id="t">Line 1&#10;Line 2</textarea>

<p id='T'></p>
<p id='p1'></p>
<p id='p2'></p>
<p id='p3'></p>

Quelques points à noter sur le HTML:

• La innerHTMLvaleur de l' TEXTAREAélément ne rend pas Html. Essayez ce qui suit: <textarea>A <a href='x'>link</a>.</textarea>pour voir.
• L' Pélément rend tous les espaces blancs contigus (y compris les nouvelles lignes) comme un seul espace.
• Le caractère LF ne s'affiche pas sur une nouvelle ligne ou un saut de ligne en HTML.
• Le TEXTAREArendu LF comme une nouvelle ligne à l'intérieur de la zone de zone de texte.

Coupez la ligne de mot-clé dans Textarea en utilisant CSS:

white-space: pre-wrap;

essayez ceci .. cela fonctionne:

<textarea id="test" cols='60' rows='8'>This is my statement one.&#10;This is my statement2</textarea>

remplacement pour les
balises:

$("textarea#test").val(replace($("textarea#test").val(), "<br>", "&#10;")));

Pour obtenir une nouvelle ligne dans la zone de texte, placez-y un saut de ligne réel:

    <textarea cols='60' rows='8'>This is my statement one.
    This is my statement2</textarea>

Vous voudrez peut-être utiliser à la \nplace de /n.

Après de nombreux tests, le code suivant fonctionne pour moi dans Typescreipt

 export function ReplaceNewline(input: string) {
    var newline = String.fromCharCode(13, 10);
    return ReplaceAll(input, "<br>", newline.toString());
}
export function ReplaceAll(str, find, replace) {
    return str.replace(new RegExp(find, 'g'), replace);
}

Ma .replace()fonction utilisant les modèles décrits dans les autres réponses n'a pas fonctionné. Le modèle qui a fonctionné pour mon cas était:

var str = "Test\n\n\Test\n\Test";
str.replace(/\r\n|\r|\n/g,'
');

// str: "Test

Test
Test"

T.innerText = "Position de LF:" + t.value.indexOf ("\ n");

p3.innerText = t.value.replace("\n", "");

<textarea id="t">Line 1&#10;Line 2</textarea>

<p id='p3'></p>

utilisez simplement <br>
ex:

<textarea>
blablablabla <br> kakakakakak <br> fafafafafaf 
</textarea>

résultat:
blablablabla
kakakakakak
fafafafafaf