요소 사용자를 얻는 방법은 현재 designMode iframe 내에서 입력하고 있습니까?

Question

designMode가 'on'으로 설정된 iframe이 있습니다. 그것에는 여러 개의 div가 있으며 iframe이 편집 가능하기 때문에 사용자는 해당 div 중 하나를 입력하고 편집 할 수 있습니다. 사용자가 div 중 하나를 편집 할 수 없게해야합니다.

이 같은 사업부 클릭에서 사용자를 방지 할 수 있습니다 :

document.getElementById('mydiv').addEventListener('mousedown', function(event) { 
    event.preventDefault(); 
    return false; 
}, true); 

그러나, 사용자는 여전히 키보드의 화살표 키를 사용하여 사업부로 커서를 통해 이동하고 편집 할 수 있습니다. div 같이 포커스를 받으면 콜백을 시도했는데, 다음과 같습니다.

document.getElementById('mydiv').addEventListener('focus', function(event) { 
    ... 
}, true); 

그러나이 콜백은 호출되지 않습니다. 그런 다음 키 누르는 것을 방지하려고 시도했습니다.

document.getElementById('mydiv').addEventListener('keydown', function(event) { 
    event.preventDefault(); 
    return false; 
}, true); 

그러나 콜백은 호출되지 않습니다. 난 문서에 콜백을 연결 시도 :

document.addEventListener('keydown', function(event) { 
    ... 
}, true); 

및 콜백 후 호출되는 않지만, 나는 대상 요소는 우려의 사업부 인 경우에만 이벤트를 취소 할 수있는 방법이 필요하다.

목표를 달성하는 방법에 대한 아이디어는 언제나 환영합니다.

Answer 1

편집 가능한 요소에 '편집 가능'클래스를 적용하고 적용 할 수없는 경우 제거 할 수 있습니다.

YUI는 다음과 같은 간단한 간단한 테스트를 제공합니다. YAHOO.util.Dom.hasClass (yourEl, 'editable');

그런 다음 처리기 내에서 대상에 '편집 가능'클래스가 없으면/return/preventDefault/stopEvent를 취소하십시오.

는

을 -d

ADDITION http://developer.yahoo.com/yui/examples/event/event-delegation.html

Answer 2

당신은 파이어 폭스 2, 각 contentEditable를 사용하는 대신 designMode를 사용하지 않는이 될 것이라고 할 수있는 가장 쉬운 방법으로 몇 이전 버전의 브라우저를 무시할 수있는 경우 편집 가능한 <div>의 편집 가능하지 않은 <div>에는 없습니다. 당신이 발견 한 것처럼

<div contenteditable="true">Some editable stuff</div> 

<div>Some non-editable stuff</div> 

<div contenteditable="true">Some more editable stuff</div> 

그렇지 않으면, 당신이지는 싸움을하고 내장 브라우저 동작.