2010-07-14 5 views
3

contenteditable = "true"으로 div에 대한 매우 간단한 WYSWIG 편집기를 구축하고 있습니다. execCommand을 사용하여 굵게, 기울임 꼴 및 밑줄과 같은 간단한 서식을 텍스트 정렬과 함께 사용합니다.Firefox에서 execCommand 정렬에 문제가 있습니까?

문제 : 굵게, 기울임 꼴, 모두 밑줄 친다.하지만 justifyCenter (또는 모든 칭찬)은 Firefox에서는 작동하지 않지만 Chrome 및 Safari에서는 작동합니다. Chrome과 Safari는 저의 justifyRight를 좋아하는 것처럼 보이지 않지만 justifyLeft와 justifyCenter를 사용하면 올바르게 작동합니다. 파이어 폭스에서 나는 다음과 같은 얻을 :

캐치되지 않는 예외

: nsresult : "0X80004005 (NS_ERROR_FAILURE)"

: [예외 ... " 0X80004005 (NS_ERROR_FAILURE) nsIDOMNSHTMLDocument.execCommand] 구성 요소 오류 코드가 반환"

나는 무엇이 잘못되었는지 알 수 없지만 Firefox에서 on으로 설정해야하는 designMode와 관련이 있을지 궁금한가요? 그러나 굵게, 기울임 꼴 및 밑줄은 designMode를 명시 적으로 켜지 않고도 정상적으로 작동합니다.

아이디어가 있으십니까? 미리 감사드립니다.

답변

1

나는 그것이 일종의 늦은 대답이라는 것을 안다. 그리고 이미 그것을 알아 냈을 지 모르지만, 그렇지 않은 사람은 몸에 맞는 내용을 설정하도록 노력해야한다. 나는 모든 브라우저가 그것없이 텍스트를 정당화하기 때문에 이것을 해결할 방법을 찾고있다. 그리고 전체 페이지를 편집 할 수 있기를 원하지 않는다.

1

버그는 여기 참조 : https://bugzilla.mozilla.org/show_bug.cgi?id=442186 누군가가이 해결 방법을 제안 :

그것은 더미 요소 (A <br />)을 생성하고 * 정당화 명령의 실행 후 제거에 구성
try 
{ 
    document.execCommand('justifyright', false, null); 
} 
catch (e) 
{ 
    //special case for Mozilla Bug #442186 
    if(e && e.result == 2147500037) 
    { 
     //probably firefox bug 442186 - workaround 
     var range = window.getSelection().getRangeAt(0); 
     var dummy = document.createElement('br'); 

     //find node with contentEditable 
     var ceNode = range.startContainer.parentNode; 
     while(ceNode && ceNode.contentEditable != 'true') 
      ceNode = ceNode.parentNode; 

     if(!ceNode) 
      throw 'Selected node is not editable!'; 

     ceNode.insertBefore(dummy, ceNode.childNodes[0]); 
     document.execCommand('justifyright', false, null); 
     dummy.parentNode.removeChild(dummy); 
    } 
    else if(console && console.log) 
     console.log(e); 
} 

.

관련 문제