แสดงผลสตริงใน HTML และรักษาช่องว่างและการแบ่งบรรทัด

ฉันมีแอป MVC3 ที่มีหน้ารายละเอียด เป็นส่วนหนึ่งของที่ฉันมีคำอธิบาย (ดึงจาก db) ที่มีช่องว่างและบรรทัดใหม่ เมื่อมีการแสดงผลบรรทัดใหม่และช่องว่างจะถูกละเว้นโดย html ฉันต้องการเข้ารหัสช่องว่างและบรรทัดใหม่เพื่อไม่ให้ถูกละเว้น

คุณจะทำอย่างไร

ฉันลอง HTML.Encode แต่มันก็จบลงด้วยการแสดงการเข้ารหัส (และไม่ได้แม้แต่ในช่องว่างและบรรทัดใหม่ แต่ในอักขระพิเศษอื่น ๆ )

white-space: pre-wrap;สไตล์เพียงแค่เนื้อหาที่มี

div {
    white-space: pre-wrap;
}

<div>
This is some text   with some extra spacing    and a
few newlines along with some trailing spaces        
     and five leading spaces thrown in
for                                              good
measure                                              
</div>

คุณลองใช้<pre>แท็กแล้วหรือยัง

http://jsfiddle.net/NweRa/

คุณสามารถใช้white-space: pre-lineเพื่อรักษาตัวแบ่งบรรทัดในการจัดรูปแบบ ไม่จำเป็นต้องแทรกองค์ประกอบ HTML ด้วยตนเอง

.popover {
    white-space: pre-line;    
}

หรือเพิ่มองค์ประกอบ html ของคุณ style="white-space: pre-line;"

คุณต้องการแทนที่ช่องว่างทั้งหมดด้วย ( ช่องว่างแบบไม่แบ่ง) และบรรทัดใหม่ทั้งหมด\nด้วย<<b></b>br>(ตัวแบ่งบรรทัดเป็น html) สิ่งนี้ควรบรรลุผลที่คุณต้องการ

body = body.replace(' ', &amp;nbsp;).replace('\n', '<<b></b>br>');

บางสิ่งในธรรมชาตินั้น

ฉันลองใช้white-space: pre-wrap;เทคนิคที่ระบุโดย pete แต่ถ้าสายยาวต่อเนื่องและนานมันก็วิ่งออกจากภาชนะและไม่ได้บิดด้วยเหตุผลใด ๆไม่มีเวลามากในการตรวจสอบ .. แต่ถ้าคุณมี ปัญหาเดียวกันฉันลงเอยด้วยการใช้<pre>แท็กและ CSS ต่อไปนี้และทุกอย่างก็ดีไป ..

pre {
font-size: inherit;
color: inherit;
border: initial;
padding: initial;
font-family: inherit;
}

ตามที่คุณพูดถึงคำตอบของ @Developer ฉันอาจเข้ารหัส HTML ในอินพุตของผู้ใช้ หากคุณกังวลเกี่ยวกับ XSS คุณอาจไม่จำเป็นต้องป้อนข้อมูลของผู้ใช้ในรูปแบบดั้งเดิมดังนั้นคุณอาจหลบหนีได้ (และแทนที่ช่องว่างและบรรทัดใหม่ในขณะที่คุณอยู่ที่นี่)

โปรดทราบว่าการหลีกเลี่ยงการป้อนข้อมูลหมายความว่าคุณควรใช้ @ Html.Raw หรือสร้าง MvcHtmlString เพื่อแสดงการป้อนข้อมูลนั้น

คุณสามารถลอง

System.Security.SecurityElement.Escape(userInput)

แต่ฉันคิดว่ามันจะไม่หนีช่องว่างเช่นกัน ดังนั้นในกรณีนี้ฉันขอแนะนำให้ใช้. NET

System.Security.SecurityElement.Escape(userInput).Replace(" ", "&nbsp;").Replace("\n", "<br>")

ในการป้อนข้อมูลของผู้ใช้ และหากคุณต้องการเจาะลึกการใช้งานบางทีคุณสามารถแยกวิเคราะห์ XML ของอินพุตของผู้ใช้ (หรือเล่นกับนิพจน์ทั่วไป) เพื่ออนุญาตเฉพาะชุดแท็กที่กำหนดไว้ล่วงหน้า ตัวอย่างเช่นอนุญาต

<p>, <span>, <strong>

... แต่ไม่อนุญาต

<script> or <iframe>

ล้อมรอบคำอธิบายในtextareaองค์ประกอบ

มีวิธีง่าย ๆ ในการทำ ฉันลองในแอพแล้วก็ใช้งานได้ดี

เพียงพิมพ์: $ text = $ row ["text"]; echo nl2br ($ text);