Метод предварительного просмотра CKEditor - PullRequest
Новая
       9

Метод предварительного просмотра CKEditor

1 голос
/ 09 декабря 2010

Мне бы хотелось, чтобы в другом месте на моей странице была кнопка, которая работает так же, как кнопка «Предварительный просмотр» на панели инструментов CKEditor. Я использую jquery, так что это будет что-то вроде этого: 

$('#previewButton').click( function () { 
$('#editor1').ckEditorGet().Preview(); 
});

Есть идеи, как мне это сделать? Я изучил документацию по API, но не нашел ни слова.

Приветствия

Ответы [ 3 ]

2 голосов
/ 09 декабря 2010

В качестве альтернативы вы можете получить содержимое редактора с помощью $('#editor1').val() и отобразить его так, как вы предпочитаете.В этом примере используется всплывающее окно: 

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script type="text/javascript" src="ckeditor/ckeditor.js"></script>
<script type="text/javascript" src="ckeditor/adapters/jquery.js"></script>

<script type="text/javascript">
    $(document).ready( function() {
        $('#previewButton').click( function () {
            var contents = $('#editor1').val();
            var mywin = window.open("", "ckeditor_preview", "location=0,status=0,scrollbars=0,width=500,height=500");

            $(mywin.document.body).html(contents);
        });

        $('#editor1').ckeditor();      
    });
</script>

<textarea id="editor1" cols="5" rows="5">
Contents...
</textarea>

<button id="previewButton">Preview</button>
1 голос
/ 18 января 2012

Используя Firebug или другой инструмент разработки, перейдите к кнопке «Предварительный просмотр» в CKEditor. Там вы найдете функцию для события click, как: 

CKEDITOR.tools.callFunction(6, this); return false;

Вы можете использовать его, чтобы открыть окно предварительного просмотра. Вы можете сделать что-л. как: 

<html><a ... onclick="openPreview(this); return false;"></a></html>
<script>function openPreview(ar_obj){ CKEDITOR.tools.callFunction(6, ar_obj); }</script>
0 голосов
/ 09 декабря 2010

На первый взгляд вы можете сделать что-то вроде этого 

$('[title="Preview"]').click();

Выберите anchor с помощью title=preview и вызовите click.

...