0

谁能用例子给大家解释一下如何集成CKEditor和外部文件浏览器?将此代码放在哪里:

    CKEDITOR.replace( 'editor1', {
    filebrowserBrowseUrl: '/browser/browse.php',
    filebrowserUploadUrl: '/uploader/upload.php'
});

什么应该返回这些:

browse.php
upload.php

我想这个问题的答案应该在这里。很多人问了这个问题,但是这个插件没有明确的指南。SO成员,也许你们中的一些人可以?

4

1 回答 1

3

filebrowserBrowseUrl将是允许用户在服务器上选择文件的页面的 url。此页面将在新窗口中打开。
这些参数将被添加到 urlCKEditor=editor&CKEditorFuncNum=2&langCode=en-gb

  • CKEditor 是当前编辑器
  • CKEditorFuncNum 是要调用的函数(将此值传递给callFunction
  • langCode 是语言

在弹出窗口调用

window.opener.CKEDITOR.tools.callFunction(CKEditorFuncNum, 'img_url');

设置所选图像并可选择window.close();关闭窗口。
例如

<?php
$files = glob('/images/directory/*.{jpg,png,gif,bmp}', GLOB_BRACE);
if (count($files) > 0){
    echo 'Select a file <ul>';
    foreach ($files as $file) {
        echo '<li><button onclick="select(this)" data-name="'.$file.'">.basename($file).</button></li>'; 
    }
    echo '</ul>';
}
?>
<script>
    function select(el){
        window.opener.CKEDITOR.tools.callFunction(<?php echo (int)$_GET['CKEditorFuncNum'] ?>, el.getAttribute('data-name'));
        window.close();
    }
</script>

filebrowserUploadUrl将是处理图像上传的 url。
它只是一个标准的文件上传处理程序,除非您在页面上运行一些 js。
并且与 . 一样将相同的参数添加到 url filebrowserBrowseUrl

<?php
... handle the upload
?>
<script>
    window.parent.CKEDITOR.tools.callFunction(<?php echo (int)$_GET['CKEditorFuncNum'], ', ', json_encode($uploaded_image_url), ', ', json_encode($message_on_failure) ?>);
</script>";

简单演示http://jsfiddle.net/mowglisanu/f2ztp/show/(上传实际上不起作用)
http://jsfiddle.net/mowglisanu/f2ztp/
http://jsfiddle.net/mowglisanu/GuA6s/show /http://phpfiddle.org/api/run/dv4-e70
_

于 2013-08-04T18:56:40.797 回答