บรรทัดใหม่ในพื้นที่ข้อความ

<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>

ฉันลองทั้งคู่ แต่บรรทัดใหม่ไม่ได้สะท้อนขณะทำการเรนเดอร์ไฟล์ html ฉันจะทำสิ่งนั้นได้อย่างไร

ลองอันนี้:

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


ฟีดสาย
การบินกลับมาเป็นหน่วยงาน HTMLวิกิพีเดีย วิธีนี้คุณกำลังวิเคราะห์คำในบรรทัดใหม่ ("\ n") แทนที่จะแสดงเป็นข้อความ

ฉันพบว่ามีString.fromCharCode(13, 10)ประโยชน์เมื่อใช้เครื่องมือดู https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/fromCharCode

สิ่งนี้จะสร้างสตริงที่มีอักขระขึ้นบรรทัดใหม่ตามจริงและบังคับให้วิวเอ็นจินส่งเอาต์พุตขึ้นบรรทัดใหม่แทนที่จะเป็นเวอร์ชันที่ใช้ Escape เช่นการใช้เอ็นจิ้นการดู NodeJS EJS - นี่เป็นตัวอย่างง่ายๆที่ควรเปลี่ยน \ n ใด ๆ :

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>

วาทกรรม

<textarea>Blah
blah
blah</textarea>

แทนที่ทั้งหมด:

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>

แสดงซอว่ามันทำงาน: http://jsfiddle.net/trott/5vu28/

หากคุณต้องการให้สิ่งนี้อยู่ในบรรทัดเดียวในไฟล์ต้นฉบับคุณสามารถแทรกการอ้างอิงอักขระ HTML สำหรับการป้อนบรรทัดและการขึ้นบรรทัดใหม่ตามที่แสดงในคำตอบจาก @Bakudan:

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

ฉันคิดว่าคุณสับสนไวยากรณ์ของภาษาที่แตกต่างกัน

• 
คือ (ค่า HtmlEncoded ของ ASCII 10 หรือ) ตัวอักษร linefeed ในสตริงHTML แต่อักขระตัวดึงบรรทัดไม่แสดงเป็นตัวแบ่งบรรทัดใน HTML (ดูหมายเหตุที่ด้านล่าง)

• \nเป็นตัวอักษร linefeed ตามตัวอักษร (ASCII 10) ในสตริงJavascript

• <br/>คือตัวแบ่งบรรทัดใน HTML องค์ประกอบอื่น ๆ อีกมากมายเช่น<p>, <div>ฯลฯ นอกจากนี้ยังทำให้การแบ่งบรรทัดเว้นแต่แทนที่ที่มีรูปแบบบาง

หวังว่าภาพประกอบต่อไปนี้จะทำให้ชัดเจนยิ่งขึ้น:

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>

จุดที่ควรทราบเกี่ยวกับ Html:

• innerHTMLค่าของTEXTAREAองค์ประกอบไม่แสดง Html ลองทำสิ่งต่อไปนี้: <textarea>A <a href='x'>link</a>.</textarea>เพื่อดู
• Pองค์ประกอบทำให้ทุกช่องว่างสีขาวที่ต่อเนื่องกัน (รวมทั้งสายใหม่) เป็นหนึ่งในพื้นที่
• อักขระ LF ไม่แสดงผลเป็นบรรทัดใหม่หรือตัวแบ่งบรรทัดใน HTML
• TEXTAREAทำให้ LF เป็นบรรทัดใหม่เขตพื้นที่ข้อความ

หยุดป้อนบรรทัดคำหลักใน Textarea โดยใช้ CSS:

white-space: pre-wrap;

ลองนี้ .. มันใช้งานได้:

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

แทนที่
แท็ก:

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

ในการรับบรรทัดใหม่ภายใน text-area ให้วาง line-break ที่นั่น:

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

คุณอาจต้องการที่จะใช้แทน\n/n

หลังจากการทดสอบมากมายรหัสต่อไปนี้ใช้ได้กับฉันใน 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);
}

.replace()ฟังก์ชั่นของฉันที่ใช้รูปแบบที่อธิบายไว้ในคำตอบอื่น ๆ ไม่ทำงาน รูปแบบที่เหมาะกับเคสของฉันคือ:

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

// str: "Test

Test
Test"

T.innerText = "ตำแหน่งของ LF:" + t.value.indexOf ("\ n");

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

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

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

เพียงใช้<br>
อดีต:

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

ผลลัพธ์:
blablablabla
kakakakakak
fafafafafaf