12

この理由を説明していただけますか:

<script type="text/javascript">
   document.write("<textarea cols='10' rows='10'>" + "\nhello\nbabe\n" + "</textarea>");
</script>

下部に改行が1つあるテキストエリアをレンダリングしますが、上部に改行はありませんか?

ここに画像の説明を入力

テスト済み IE8、FF11、Safari 5.1、Chrome 24

これは JS の問題ではありません。ページに HTML を記述しても、同じ結果が得られます。

<textarea cols='10' rows='10'>
hello
babe
</textarea>

最初の新しい行がまだありません!!!

表示するには、上部に別の新しい行を追加する必要があります。

document.write("<textarea cols='10' rows='10'>" + "\n\nhello\nbabe\n" + "</textarea>");
4

6 に答える 6

5

XHTML 内に記述する場合は、適切なエンティティを使用してください。

<textarea>&#13;hello</textarea>

テキスト ノードが空白 (スペース、改行) で始まる場合、HTML パーサーによって無視されます。新しい行を適切な HTML エンティティにエンコードすると、パーサーはそれを認識します。

&#13; == carriage return
于 2013-03-20T16:49:39.037 に答える
3

可能であれば、テキストエリアが html として事前定義されるようにコードを変更し、代わりに次のように文字列を記述します。

HTML:

<textarea cols='10' rows='10' id='test'></textarea>

脚本：

document.getElementById('test').innerHTML = '\nhello\nbabe\n';

それは空白を保持するはずです。オプションで、CSS ルールを追加できます。

textarea {
    white-space:pre;
    }

遊ぶためのフィドル:
http://jsfiddle.net/RFLwH/1/

アップデート：

これが機能しない IE8 でテストされた OP - このブラウザの制限/バグのようです。手動で改行を先頭に挿入すると、IE8 は実際には CR+LF を使用しますが、プログラムで設定すると、ブラウザーはこれを完全に無視します。

これを html に追加して、テストを行います。 

<span onclick="this.innerHTML = escape(document.getElementById('test').innerHTML);">
    Get textarea content
</span>

返される文字列は次のとおりです。

 %0D%0Ahello%20babe%20

CR+LF があることを意味します (他の改行はスペースに変換されますが、最初にスペースを挿入しても役に立ちません)。この動作についてできることは何もないと思います。ブラウザは時代遅れです (ただし、残念ながらまだ広く使用されているため、これが不可欠な場合、これらのユーザーにとっては問題になる可能性があります)。

于 2013-03-20T16:50:25.147 に答える
1

\n\r上部 にあるはずです：document.write("<textarea cols='10' rows='10'>" + "\n\rhello\nbabe\n" + "</textarea>");

jsbin

于 2014-05-29T18:00:17.290 に答える
1

次のように、最初の「\n」の前に空白を追加します。

<script type="text/javascript">
   document.write("<textarea cols='10' rows='10'>" + " \nhello\nbabe\n" + "</textarea>");
</script>

また

<textarea cols='10' rows='10'> <!-- whitespace here -->
hello
babe
</textarea>

そうしないと機能しません。

更新:サーバー側で後で、次のようにして最初の空白を削除できます

$str = ltrim ($str,' ');

また

$str2 = substr($str, 4);

PHPの場合。

于 2013-03-20T16:47:08.077 に答える
0

最後に、このサーバー側のソリューションを完成させました：

テキストエリアに出力する前に、先行する（最初だけ！）nlシンボルを2倍にするには：

if(str_startswith("\r\n",$value))
{
    $value = "\r\n".$value;             
}elseif(str_startswith("\n",$value))
{
    $value = "\n".$value;
}elseif(str_startswith("\r",$value))
{
    $value = "\r".$value;
}

function str_startswith($start, $string)
{
  if(mb_strlen($start)>mb_strlen($string))
    return FALSE;
  return (mb_substr($string, 0,mb_strlen($start))==$start);
}
于 2014-02-25T18:27:07.977 に答える