2013-12-08 3 views
3

Я использую inline Ckeditor для редактирования содержимого. По умолчанию встроенный редактор активируется двойным щелчком мыши div с contenteditable="true". Я хочу активировать этот встроенный редактор, когда я нажимаю кнопку, и скрываю его, когда я нажимаю другую кнопку. Вот пример HTML-код:Ckeditor: показать и скрыть встроенную панель инструментов по запросу

<html> 
    <head> 
    <script src="ckeditor/ckeditor.js"></script> 
    </head> 
<body> 
    <div id="first" contenteditable="true">first</div> 
    <div id="second" contenteditable="true">second</div> 

    <input type="button" value="show inline editor"> 
    <input type="button" value="hide inline editor"> 
</body> 
</html> 

Jsfiddle показывает поведение и то, что я хочу иметь http://jsfiddle.net/vdRYL/

+0

Это будет легко для нас, чтобы решить эту проблему, если вы можете создать jsfiddle (jsfiddle.net), показывающий поведение по умолчанию CKEditor. – Rao

+0

Благодарим вас за ответ и редактирование. Вот jsfiddle: http://jsfiddle.net/vdRYL/ – user2265529

ответ

1

CKEditor, кажется, активируя редактор окна на focus из contenteditable элемента, а не по умолчанию double-click. Вы можете сделать что-то вроде этого, чтобы ваши кнопки работать,

http://jsfiddle.net/nagendra_rao/vdRYL/1/

1

Вы можете использовать focusManager.blur(true) для того, чтобы скрыть панель инструментов.

http://jsfiddle.net/vdRYL/24/

var cke = CKEDITOR.inline('target'); 

var btnClose = document.getElementById('btnClose'); 
btnClose.addEventListener('click', function(event){ 
cke.focusManager.blur(true); 
}); 

Более подробную информацию о FocusManager здесь: http://docs.ckeditor.com/#!/api/CKEDITOR.focusManager-method-blur

0

Мы можем скрыть и показать панель инструментов. Я достиг этой функции следующим образом:

Открыть ckeditor.js файл. И вставьте ниже код в конце файла

$(document).ready(function() { 
    CKEDITOR.on('instanceReady', function (ev) { 
     document.getElementById(ev.editor.id + '_top').style.display = 'none'; 


     ev.editor.on('focus', function (e) { 
     document.getElementById(ev.editor.id + '_top').style.display = 'block'; 

     }); 
     ev.editor.on('blur', function (e) { 
     document.getElementById(ev.editor.id + '_top').style.display = 'none'; 

     }); 
    }); 
}); 
Смежные вопросы