2011-10-08 3 views
6

div 또는 p로 둘러싸인 contenteditable div의 컨텐츠를 강제로 작성하는 방법을 아는 사람이 있습니까? contenteditable의 내용이 빈 div 인 경우 범위를 사용하여 선택하면 Firefox에서 작동하지만 예를 들어 크롬에서는 텍스트가 div 앞에 삽입됩니다. 나는 결코 새로운 대신 < BR/> 태그를 얻을해야이 빈의 contentEditable에 어떻게 든 가능한 경우,이 수동으로 줄 바꿈을 삽입에 사용될 수있는 텍스트 여기컨텐츠 편집 가능 컨텐츠를 div 또는 p 내에 넣으십시오

HTML: 
<div id="edit" contenteditable="true"><div id="insert"></div></div> 

Tried this but the results are very inconsistent cross browser: 

var range = document.createRange(); 
range.selectNodeContents(document.getElementById('insert')); 

var selection = window.getSelection(); 
selection.removeAllRanges(); 
selection.addRange(range); 

두 번째 질문이 필요합니다 div 또는 p?

감사

그것은 어느 정도에서 다음 작품 보인다

업데이트 : 모두가 하나의 빈 줄을 생성 추가 < BR/> 파이어 폭스, 크롬, 사파리와

<div id="edit" contenteditable="true"><div id="insert"><br/></div></div> 

을 모든 입력은 div 내부에서 끝나지 만 Internet Explorer (테스트 된 버전 9)에는 두 개의 빈 줄이 표시됩니다. 사용할 수있는 다른 솔루션이 없다면 브라우저 감지 기능을 사용하지 않고이 문제를 해결하는 방법이 있습니까?

+0

나는 Firefox에서 여전히 많은 버그를 수정하기 위해 한 달 넘게이 답변을 찾고있었습니다. Thx u thx u thx u. –

답변

0

CSS 파일에서 br 태그를 무시할 수 있습니다.

br { 
    display:block; 
    clear: both; 
    height: 1em; 
    line-height: 1em; 
} 

나는 em가 작동하는지 확실히 모르겠습니다. 그렇지 않은 경우도 px 형식으로 시도해야합니다.

관련 문제