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>

ckeditor上传图片的注意点的更多相关文章

  1. Ckeditor上传图片返回的JS直接显示出来,未执行!!!

    Ckeditor上传图片网上有很多教程. 下面是我今天下午遇到的一个坑...自己挖的坑. 在conotroller里 我开始习惯性的 response.setContentType("app ...

  2. 去除ckeditor上传图片预览中的英文字母

    去除ckeditor上传图片预览中的英文字母 CKEDITOR.replace('text', { filebrowserImageUploadUrl : 'upload_img.do', langu ...

  3. 如何去除 ckeditor 上传图片后在原码中留下的 style="width: 100%;height:100px"之类的代码呢?

    ckeditor编辑器在上传图片的时候,会神奇的加上一段诡异的代码: 这导致上传的小图也是被拉伸到100%,我根本就没有定义它,找来找去也找不到element.style,原来这是在system.cs ...

  4. django使用ckeditor上传图片

    1.在模型类中设置字段为富文本类型,这里需要注意引入的是RichTextUploadingField,以允许上传图片,需要和RichTextField区分开 from ckeditor_uploade ...

  5. 记一次ckeditor上传图片到服务器问题

    package com.util;import java.io.IOException; import java.io.PrintWriter; import java.util.List;impor ...

  6. 使用 CKEditor 上传图片, 粘贴屏幕截图

    之前写过wangEditor,那真是好用,文档也清晰,半天就搞定了,无奈没有对应license,只好选择别的. 外语一般,阅读理解都靠蒙.CKEditor官方文档看的我云里雾里,国内的博客比较少,经过 ...

  7. ckeditor 上传图片解决跨域问题

    前后端分离ckeditor跨域问题处理 这个跨域问题很常见,特别是前后端分离的情况,IP地址不同导致了页面跨域,具体原因大多是因为前端ifame问题 分析 ckeditor插件里config.js需要 ...

  8. CKeditor上传图片 实现所见即所得界面

    迟了好多天的分享,CKeditor这个编辑器虽然不错,但也真苟啊,搞图片上传这个功能,快给我搞佛系了,话不多说,上代码 1.首先去官网下载一个full的版本,我用的是CKeditor 4.13,解压之 ...

  9. CKEditor上传图片—配置CKFinder

    参考:http://blog.csdn.net/gavin710/article/details/8741738

随机推荐

  1. centos jdk 安装

    1)下载JDK 1.7(1.7.0_25) 下载地址为: http://www.Oracle.com/technetwork/java/javase/downloads/jdk7-downloads- ...

  2. js格式化时间为JSON格式 ajax提交 后台处理

    var effectRow = new Object();if ($('#grd_infos').datagrid('getChanges').length) {    var update = $( ...

  3. 关于Container With Most Water的求解

    Container With Most Water 哎,最近心情烦躁,想在leetcode找找感觉,就看到了这题. 然而,看了题目半天,硬是没看懂,于是乎就百度了下,怕看到解题方法,就略看了下摘要,以 ...

  4. chap3 数组 #C

    4.1 数组的基本概念 4.1.1 要点归纳 一维数组 定义: int a[10]; 数组名是一个地址常量,不允许修改. 引用: 初始化: 静态数组 static int a[10];的初值? 全部赋 ...

  5. 在二叉搜索树(BST)中查找第K个大的结点之非递归实现

    一个被广泛使用的面试题: 给定一个二叉搜索树,请找出其中的第K个大的结点. PS:我第一次在面试的时候被问到这个问题而且让我直接在白纸上写的时候,直接蒙圈了,因为没有刷题准备,所以就会有伤害.(面完的 ...

  6. PDF在线阅读 FlexPaper 惰性加载 ;

    关于PDF在线阅读问题,比较普遍的做法是转换成swf文件来浏览:由于项目需要,就用 flexpaper 来实现了下,功能比较简单:但是文件的惰性加载确实让笔者挠头了一把! 下面是笔者的方法: 采用流的 ...

  7. js 设计模式-接口

    js模拟java接口检测函数:确保子类实现接口中的方法:(出自js设计模式) 上代码: <script type="text/javascript" > <%-- ...

  8. 1.webpack-----模块加载器兼打包工具

    一.webpack的优势 1. 能模块化 JS . 2. 开发便捷,能替代部分 grunt/gulp 的工作,比如打包.压缩混淆.图片转base64等. 3. 扩展性强,插件机制完善,特别是支持 Re ...

  9. div套div 里面div有浮动 外面div自适应高度

    <div style="background-color:red;"> <div style="float:left;background-color: ...

  10. redis简单总结

    一.redis的准备. 下载redis:路径:Linux:http://www.redis.io.comwindow:http://www.newasp.net/soft/67186.html 解压后 ...