如何保留內容中的空白可編輯div

Question

我正在使用內容可編輯div作爲字段來獲取我的網站中的用戶輸入。 但我的問題是，當我得到使用jquery div的內容時，所有的空格都丟失了由用戶在div中輸入？

所以，我想知道是否有任何方法來保留內容可編輯div的所有空格？

謝謝

Answer 1

div有一個默認的空白：normal ;.無論如何它是如何消失的，你如何獲取/獲取內容？我認爲換行符也將是一個問題

<div class="input" contenteditable="true">abc 123 def 456</div> 
<button class="get">get</button> 
$('.get').click(function(){alert($('.editable').text());}); 

JSFiddle

Answer 2

我找到了答案在這裏：http://simonewebdesign.it/blog/how-to-make-browser-editor-with-html5-contenteditable/

的內容編輯的元素你的CSS樣式應包含以下內容：

.content_editable_element {

white-space: pre-wrap;  /* css-3 */ 
    white-space: -moz-pre-wrap; /* Mozilla, since 1999 */ 
    white-space: -pre-wrap;  /* Opera 4-6 */ 
    white-space: -o-pre-wrap; /* Opera 7 */ 
    word-wrap: break-word;  /* Internet Explorer 5.5+ */ 

}