如何保留内容中的空白可编辑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+ */ 

}