contenteditable에서 브라우저 마크 업 사용 안함

contenteditable div에 브라우저가 HTML 태그 이외의 것을 추가하지 못하게하고 싶습니다.contenteditable에서 브라우저 마크 업 사용 안함

ifs, ands, buts 또는 candied nuts는 확실하지 않습니다.

지금 크롬은 특히 나에게 정말로 자극적입니다. 나는 스타일이 설정되어있는 경우

는

p { font-size:1.2em; line-height:1.6em; }

그것은 말할 것이다라고 "오, 당신이 원하는 의미한다"

<span style="font-size:1.2em; line-height:1.6em;">stuff</span>

내가 가장 확실하지 않습니다. 사실, 나는 ANY span 태그를 만드는 것을 원하지 않습니다. 내가 그렇게한다면, 나는 자바 스크립트에서 그렇게 말할 것이다. 브라우저 개발자 ... "오, 우리가해야"

이것은 매우 실망 문제이고, 나는 contenteditable 여전히 버그와 가까운 시력 전체 초킹 (chock) 당신의 자신의 위험 웹 기능에서 그 사용 중 하나입니다 알고 그게 정말 멋진 깨끗한 HTML을 만들기 위해을 빨아.

여기에 할 수 있는게 있나요? 나는 이미 execCommand의 단점을 극복 한 MIcrosofts의 배제 된 코드 수프를 고치기 위해 "Word에서 붙여 넣기"를 길들인 바있다.

나는 여기까지 왔다가 원치 않는 불필요한 마크 업을 브라우저에 주입 할 수 없다면 나는 당황 할 것이다. 그러나 걱정된다. 희망이 있습니까?

출처

2014-02-05 Casey Dwayne

콘텐츠를 직접 파싱해야합니다. –

Webkit/Blink의 세계에 오신 것을 환영합니다! 약 1 년 전에 https://code.google.com/p/chromium/issues/detail?id=226941 https://bugs.webkit.org/show_bug.cgi?id=114791 버그가보고되었으며 여러 번 upvoted과 아무것도하지 않았습니다. . – Reinmar

나는 보고서를 보았고, 단지 의견을 남겼다. 매우 불행한. 매우 예측할 수 없습니다. 나는 정말로 텍스트를 사용하지 않는 옵션을 원했다. 일종의 인라인 편집을 폐지하지만,이 문제를 해결하기 위해 뭔가 할 때까지 사용자가 텍스트 영역의 항목을 편집하도록 강요한다고 가정합니다. –

"모든 ANT 태그를 만드는 것을 원하지 않습니다"라는 점에 관해서는 스팬 태그를 전혀 허용하지 않도록 구성된 고급 내용 필터를 사용하는 것이 어떻습니까? 그럴 수도 있습니다. 또는 때로는 간간히 나타 내기를 원할 경우 font-size 및 line-height의 스팬 스타일을 허용하지 않도록 구성하십시오.

출처

2014-02-13 06:23:26 Nenotlep

다음은 contenteditable 요소에 적용 할 수있는 함수이며, 요소가 nodeName "#text"의 단일 자식 노드로 끝나도록합니다.

var sanitizeContentEditable(elem) { 
    var textContent = []; 
    for (var i = 0; i < elem.childNodes.length; i++) { 
     var child = elem.childNodes[i]; 
     textContent.push(child.textContent); 
     if (child.nodeName !== '#text') textContent.push('\n'); 
    } 
    elem.innerHTML = textContent.join(''); 
};

이 기능은 단순히함으로써 contenteditable 요소 하나만을 갖는 것을 보장하는, 모든 자식 요소의 텍스트 콘텐츠를 얻어 텍스트가 아닌 자식 요소의 내용 개행을 추가하며 함께 그러한 모든 문자열을 조인 텍스트 유형 아동.

출처

2017-04-06 23:19:23

contenteditable에서 브라우저 마크 업 사용 안함

답변

관련 문제