CKEditor预览方法

发布于 2024-10-06 13:15:12 字数 248 浏览 4 评论 0原文

我希望在页面上的其他位置有一个按钮，其运行方法与单击 CKEditor 工具栏中的“预览”按钮相同。我正在使用jquery，所以它会是这样的：

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

有什么想法可以实现这个吗？我仔细研究了 API 文档，但找不到任何相关内容。

干杯

原文

I would like to have a button elsewhere on my page that runs the same method that clicking the "Preview" button does in the CKEditor toolbar. I'm using jquery so it would be something like this:

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

Any ideas how I could accomplish this? I pored over the API documentation but can't find a word on it.

Cheers

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

宣告ˉ结束 2024-10-13 13:15:12

或者，您可以使用 $('#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>

Alternatively you can get the editor contents with $('#editor1').val(), and display it the way you prefer. This example uses a popup window:

<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>

回复收藏 0 原文

葬花如无物 2024-10-13 13:15:12

使用 Firebug 或其他开发工具导航到 CKEditor 中的“预览”按钮。在那里您将找到有关单击事件的功能，例如：

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>

Using Firebug or other development tool navigate to the "Preview" button in the CKEditor. There you'll find function on the click event like:

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

You can use it to open a preview window. You can do smth. like:

<html><a ... onclick="openPreview(this); return false;"></a></html>
<script>function openPreview(ar_obj){ CKEDITOR.tools.callFunction(6, ar_obj); }</script>

回复收藏 0 原文