2017-08-31 20 views
0

说我有以下字符串:饲养文本:无论换行,空格和长单词

"This line should always break on newline \n, spaces if it is about to overflow and veryLongLinksThatDoNotFitInsideTheDiv" 

我希望它打破:

,我想:

<div id="log" style="word-break: break-all"></div> 
    <!-- <div id="log" style="word-wrap: break-word"></div> --> 
    <!-- <div id="log" style="white-space: pre-line"></div> --> 
    <!-- <div id="log" style="white-space: pre; word-break: break-all"></div> --> 

但我不能得到所有3(也不4)标准满足。

小提琴:https://jsfiddle.net/6kq14cfc/

回答

1

您可以使用

<div id="log" style="overflow-wrap: break-word;white-space: pre-wrap;"></div> 

<div id="log" style="word-wrap: break-word;word-break: normal;white-space: pre-wrap;"></div> 
+0

艾米特,谢谢你的回复。不幸的是,至少在我的小提琴中,建议的解决方案没有解决换行符“\ n”。它确实满足其他要求。 –

+0

@ThomasHubregtsen:确认,同时放置两个\ n。你应该看到额外的换行符。 – Amit

0

我觉得你的答案就在于用 “< BR/>” 取代 “\ n”。 HTML无法识别新行字符 - 它需要代替< br/>标记。

+0

谢谢拉玛施奈德。然而,“白色空间:前线”确实接受\ n作为新线。不幸的是,在这种情况下,break这个词不起作用。 (我把这也放在小提琴展示)。如果可能的话,我不想改变我的服务器发送/执行替换JavaScript中的数据。 –