170

<textarea>JavaScriptで編集しています。問題は、改行すると表示されないことです。これどうやってするの？

関数を書くための値を取得していますが、改行はありません。

4

9 に答える 9

293

問題は、改行（ ？）がHTMLタグ\n\rと同じではないという事実に起因します<br/>

var text = document.forms[0].txt.value;
text = text.replace(/\r?\n/g, '<br />');

アップデート

コメントの多くと私自身の経験から、このソリューションが期待どおりに機能していないことがわかったので、 「\ r\n」を使用し<br> て新しい行を追加する方法の例を示します。textarea

function log(text) {
    var txtArea ;

    txtArea = document.getElementById("txtDebug") ;
    txtArea.value +=  text + '\r\n';
}

私はこれを編集することにしました。これはあまりにも人気のある答えであり、間違っているか不完全であるため、新しい質問としてではありません。

于 2009-05-14T14:55:09.777 に答える
24

一般的なJavaスクリプトを使用していて、テキスト領域の値に文字列を割り当てる必要がある場合は、

 document.getElementById("textareaid").value='texthere\\\ntexttext'.

交換する必要があり\nます< br >\\\n

それ以外の場合はUncaught SyntaxError: Unexpected token ILLEGAL、すべてのブラウザで使用できます。

于 2012-01-19T06:30:15.620 に答える
19

あなたは内部に使用する必要が\nありlinebreaksますtextarea

于 2009-05-14T14:54:20.857 に答える
19

多分誰かがこれが役に立つと思うでしょう：

サーバー変数からjavascript変数に渡される改行に問題があり、javascriptがそれらをtextareaに書き込んでいました（knockout.js値バインディングを使用）。

解決策は、新しい行を二重にエスケープすることでした。

orginal.Replace("\r\n", "\\r\\n")

サーバー側では、エスケープ文字が1つしかないため、javascriptは解析されませんでした。

于 2013-05-31T13:59:35.650 に答える
7

自分のページ内にテキストを表示したい場合は、<pre>タグを使用できます。

document.querySelector('textarea').addEventListener('keyup', function() {
  document.querySelector('pre').innerText = this.value;
});
<textarea placeholder="type text here"></textarea>
<pre style="font-family: inherits">
The
new lines will
be respected
      and spaces too
</pre>

于 2018-06-10T21:09:18.353 に答える
4

IDが#infoartistのテキストエリアがあります。

<textarea id="infoartist" ng-show="dForm" style="width: 100%;" placeholder="Tell your contacts and collectors about yourself."></textarea>

javascriptコードでは、textareaの値を取得し、エスケープする改行（\ n \ r）を<br />次のようなタグに置き換えます。

var text = document.getElementById("infoartist").value;
text = text.replace(/\r?\n/g, '<br />');

したがって、jqueryを使用している場合（私のように）：

var text = $("#infoartist").val();
text = text.replace(/\r?\n/g, '<br />');

お役に立てば幸いです。:-)

于 2015-03-30T19:50:45.823 に答える
2

改行はブラウザにとって単なる空白であり、通常のスペース（ ""）とは何の違いもありません。新しい行を取得するには、<BR />要素を挿入する必要があります。

この問題を解決する別の試み：テキストをtextareaに入力し、ボタンの後ろにJavaScriptを追加して、非表示の文字を読み取り可能なものに変換し、結果をにダンプしDIVます。それはあなたのブラウザが何を望んでいるかを教えてくれます。

于 2009-05-14T14:54:28.313 に答える
0

テストエリアの値を改行してサーバーに送信する必要がある場合は、nl2brを使用してください

于 2013-03-05T13:17:25.580 に答える
0

これが私が持っていたのと同じ問題のために私がしたことです。

jspの次​​のページにテキストを渡すとき、次のようなものを読むのではなく、テキストエリアとして読んでいます。

そのため、出力は希望どおりになりました。その他のプロパティについては、以下のように使用できます。

<textarea style="background-color: white; border: none; width:660px;font-family: Arial, Helvetica, sans-serif; font-size:1.0em; resize:none;" name="text" cols="75" rows="15" readonly="readonly" ><s:property value="%{text}"/></textarea>
于 2014-10-23T22:29:25.953 に答える