2013-10-09 6 views
0

나는 TinyMCE (documentation)와 CKEditor을 시도하고 모두 초기화를 위해 이러한 종류의 코드를 필요로 :TinyMCE - 편집 가능한 영역이 없습니까?

tinyMCE.init({ 
    selector: '.some-div-with-text-inside', 
    inline: true, 
    fixed_toolbar_container: '.toolbar', 
    valid_elements: '*[*]', 
    setup: function(editor) { 
      // something that happens on setup 
    } 
}); 

그래서, 기본적으로 몇 가지 선택이 필요하며 .some-div-with-text-inside 클래스 모든 된 DIV가 TinyMCE에의 편집 ​​가능한 영역이 될 것입니다. 편집기는 .toolbar 컨테이너에 나타납니다.

==========================는

내가 이상적으로 달성하고자하는 것은 어떤 부착되지 않은 편집기입니다 DIV 또는 TEXTAREA와 기능 (예 : "굵은 텍스트", "링크 만들기")은 선택이 이루어지는 한 문서의 내용 편집 가능 영역에서 작동합니다. Rangy으로 정확히 가능합니다. 데모보기 :이 같은 http://rangy.googlecode.com/svn/trunk/demos/cssclassapplier.html

TinyMCE에에서 V3 뭔가 사용할 수있었습니다 :

$(function(){ 
      tinyMCE.init({ mode: "none", theme: "simple" }); 
      tinymce.execCommand("mceAddControl", false, "myEditableDIV"); 
}); 

그러나 mode: "none" 더 이상 V4에 있고 두 번째 줄은 이제 tinyMCE.execCommand("mceAddEditor", false, "myEditableDIV");되었다 그러나이있을 때 여러 편집 된 DIV 다음이 방법 추가 편집기가 여러 번 표시됩니다.. 그걸 막을 수있는 방법이 있는지 궁금하네요?

난 그냥 contenteditable와 현재의 모든 1 편집기와 미래 된 div해야합니다. 일부 DIV가 문서에 추가되거나 문서에서 제거 될 수 있습니다. 나는 그들의 문서에서 모든 옵션을 검토했는데 제대로 작동하지 못했습니다.

답변

0

난 당신이 TinyMCE에를 연결하지 않고도 DIV 또는 텍스트 영역을 편집 할 수 있다고 생각하지만, 여기에 당신이 할 수있는 하나의 트릭 - 당신은 현재 DIV에 초점을하거나 경우에만이 HIDE 편집기 도구 모음과를 표시 할 수 있습니다 텍스트 영역.

editor.on('focus', function(e) { 
     and here show the toolbars 
    }); 
:이를 위해이 기능을 사용할 수 있습니다
관련 문제