zoukankan      html  css  js  c++  java
  • ckeditor上传图片的注意点

    1、要在 ckeditor的  config.js 文件中加上

    CKEDITOR.editorConfig = function( config ) {

        config.filebrowserImageUploadUrl = 'ckEditImageUpload';//上传图片的接口
    };

    2、实现上传接口

        @RequestMapping(value = "ckEditImageUpload", method = RequestMethod.POST)
        @ResponseBody
        public String ckEditImageUpload(MultipartHttpServletRequest request,HttpServletResponse response) throws BaseException
        {
            String fullPath = null;
            String callback = request.getParameter("CKEditorFuncNum");
            MultipartFile file = request.getFile("upload");
            fullPath = uploadService.getFileUrl(file);
            response.setContentType("text/html;charset=UTF-8");
            response.setHeader("X-Frame-Options", "SAMEORIGIN");
            return "<script type='text/javascript'>"
            + "window.parent.CKEDITOR.tools.callFunction(" + callback
            + ",'" + fullPath + "',''" + ")"+"</script>";
        }

    另在页面中插入ckeditor:

    引入js   <script type="text/javascript" src="${rootURL}resources/ckeditor/ckeditor.js"></script>

    替换

        <td colspan="3">

                    <textarea name="content" id="content" rows="10" cols="40">${banner.content}</textarea>
                    <script>
                        // Replace the <textarea id="editor1"> with a CKEditor
                        // instance, using default configuration.
                        CKEDITOR.replace('content');
                    </script>
                    </td>

  • 相关阅读:
    《算法导论》读书笔记(五)
    《算法导论》读书笔记(四)
    《算法导论》读书笔记(三)
    《算法导论》读书笔记(二)
    《算法导论》读书笔记(一)
    Posix消息队列
    管道和FIFO
    linux内核数据结构之kfifo
    linux内核数据结构之链表
    Mybatis XML 映射配置文件 -- 熟悉配置
  • 原文地址:https://www.cnblogs.com/yousen/p/4736470.html
Copyright © 2011-2022 走看看