javascript - 改行を保持する方法

Question

改行とキャリッジリターン...コーディングの最も複雑な部分である必要があります。（私のため）

このコードをページに入れます（データベースから取得したものとして保存されていますThis from Ricardo\nAnd also a test\nRent 3000.00）：

<td title="This from Ricard
And also a test
Rent 3000.00" style="width:198px;text-align:left">....</td>

次に、これを使用して、「非表示」のタイトル属性を取得します\ n

var v = $('#'+i).parent().attr('title');        // i = id of <span> child of <td>

途中で、改行が失われ、変数vをテキスト入力ボックスに使用します。

This from RicardAnd also a testRent 3000.00

を保存し、\n's代わりに以下のようにするには何が必要ですか？

$[編集]をクリックした後の目的の結果のスクリーンショット（\ nが存在する）$

score 16 · Accepted Answer

改行はまだそこにあります、それはブラウザがそれらをレンダリングしようとするだけです。

それでも「\n」を表示したい場合は、次のことを試してください。

var v = $('td:first-of-type').attr('title').replace(/\n/g, "\\n");

それ以外の場合、「\ n」を表示せず、代わりに改行を表示する必要がある場合は、次のように実行できます。

var v = $('td:first-of-type').attr('title').replace(/\n/g, "<br/>");

score 2 · Accepted Answer

javascriptグローバルメソッドescape()を使用して文字列vをエンコードし、unescape（）を使用してデコードして使用することができます。

これがyour5フィドルです

コードでは、この行は次のようになります

var v = escape($('#'+i).parent().attr('title'));

score 1 · Accepted Answer

文字列をテキスト入力ボックスに入れると、テキスト入力ボックスは1行のみのテキストであるため、新しい行はありません。

そこ\nにあります-あなたはそれらによって分割を試みることができます：

lines = str.split("\n")

score 0 · Accepted Answer

この質問に興味があったので、ソースを確認する必要がありました：http ://www.w3.org/TR/html401/struct/global.html#adef-title

W3Cは、属性内のさまざまな形式の空白がどのように扱われるかについて完全に沈黙しているので、HTMLと同じ規則に従っていると思い込ませます。

HTMLでは、<PRE>要素または同様のCSSルールの下にない限り、レンダリングのためにすべての空白が1つのスペースに折りたたまれます。

したがって：

<p>The    quick  brown
fox
jumped



over the
lazy dog</p>

次と同じようにレンダリングされます：

<p>The quick  brown fox jumped over the lazy dog</p>

このHTMLの動作は、ユーザーエージェント（ブラウザー）が任意の方法で属性をレンダリングできるという事実と相まって、そのTITLEようなエージェントのほとんど（すべてではないにしても）が行末マーカー（carriage returnおよびnewlineまたは\r\n）。

編集：

フォーマットが重要な場合は、titleテキストをエスケープしてdata-*要素内に配置できます。マウスオーバーを使用すると、カスタムポップアップボックスに代わりにフォーマットされたHTMLを表示できます。

編集2-元の質問から引用：

<td data-title="This from Ricard<br><br>And also a test<br>Rent 3000.00"
style="width:198px;text-align:left">
 ....
</td>

要するに、いくつかのmouseoverコードでは、次のテキストを見つけることができます：

var mytitle = <element>.getAttribute("data-title");

次に、ポップアップdivを使用してmytitleを表示します

score 0 · Accepted Answer

これをデータベースから直接読み取る必要があります。サイトのHTMLが生成されているときに行末が解釈されているため、コードに複数行のtd要素が表示されます。

そのtd要素を参照すると、値が1行で吐き出されます。このデータが失われると、どのような方法でもそれを再作成することはできません。

score 0 · Accepted Answer

HTML仕様によると、すべての改行は「エスケープ」する必要があります。


6 に答える 6