2011-12-20 16 views
7

我正在使用的應用程序讓用戶以明文形式輸入內容,稍後將顯示爲HTML。爲了使用戶的內容顯示爲很好地,我們把內容如下:將新行轉換爲段/ HTML標籤,這可以是一個單一的正則表達式嗎?

  • 由兩個或多個新行字符分隔的任何文本塊都包裹在<p>標籤。新的行字符(以及中間的任何空格)被刪除。

  • 任何單個新行字符(以及周圍的空白字符)將被替換爲< br/>標記。

我目前通過將文本通過兩個正則表達式替換實現這一點,但不知道是否可能被合併爲一個。這裏是我現在所擁有的(JavaScript):

// content holds the text to process 
content = '<p>' + content.replace(/\n([ \t]*\n)+/g, '</p><p>') 
       .replace(/\n/g, '<br />') + '</p>'; 
+0

只是好奇,你使用任何類型的HTML/JavaScript編輯器像TinyMCE或YUI?或者只是一個form/textarea元素? – Dave 2011-12-20 17:05:22

+0

只是一個普通的舊形式的文本區域 – 2011-12-20 17:10:14

+0

你好,你能解決它嗎? – Sisir 2014-12-24 07:08:54

回答

9

有兩種不同的替換字符串。所以不可能在單一替換呼叫中進行。

但第二個替換()可以更改爲更有效的普通字符串替換。

content = '<p>' + content.replace(/\n([ \t]*\n)+/g, '</p><p>') 
       .replace('\n', '<br />') + '</p>'; 

所以,只有一個正則表達式。 :)

更新

的Javascript嚇我。字符串replace只處理第一次出現。

How to replace all occurrences of a string in JavaScript?

有也給出了replaceAll幾種可能的解決方法實現。

+1

該解決方案的問題在於第二次替換調用僅替換第一次匹配而不是全部匹配。你需要'.replace(/ \ n/g,'
')'來捕捉*所有*剩下的換行符。 – 2014-01-14 14:11:49

+0

我站好了。謝謝。更新了答案。 – Vadzim 2014-01-14 14:52:31

1

我正面臨着一個類似的要求 - 模仿wpautop功能成javascript(用於主題定製器)。

因此,這裏是我的解決問題的方法:

首先,更換的情況時有兩個換行符。

to = to.replace(/\n{2}/g, '&nbsp;</p><p>'); 

然後,替換隻剩一條換行符的情況。

to = to.replace(/\n/g, '&nbsp;<br />'); 

而最後裹在<p>標籤

to = '<p>' + to + '</p>'; 

我用& NBSP的全部內容;因爲我的造型在段落之後隱含了餘量。如果你不需要它們,你可以忽略它們。另外,一個缺點是單行換行插入到下一段的開頭,但這是我可以忍受的。

相關問題