欢迎访问wabc.cc — 源码交易 · 软件定制 · 建站服务一站式平台
全部分类
首页 - 首页 - 解决方案 - 推荐文章 - CKEditor的使用

CKEditor的使用

分类:推荐文章 · 发布:2025-12-21 · 浏览:1


简介

CKEditor是一个富文本编辑器。是一种内嵌于网站中,呈现一种所见即所得的页面效果。常见于博客类型网站、或者电商网站管理系统中对商品文案的编辑功能。

基本使用

1、首先,下载地址:https://ckeditor.com/ckeditor-4/download/ 下载之后将下载包中的js和css导入项目中。


2、然后,写一个简单的带一个textarea的页面。

Title


class="ckeditor"

name="content" cols="120" rows="15" placeholder="请输入内容">




3、接下来,编写页面需要的上传和下载,显示图片的servlet。代码如下:

package com.qianfeng.day9.servlet;


import com.qianfeng.day9.util.Constants;


import javax.servlet.ServletException;

import javax.servlet.annotation.WebServlet;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

import java.io.File;

import java.io.FileInputStream;

import java.io.IOException;

import java.io.OutputStream;


@WebServlet("/file.do")

public class FileServlet extends BaseServlet {

public void show(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

String name = request.getParameter("name");

try {

File file = new File(Constants.IMAGE_PATH + name);

FileInputStream inputStream = new FileInputStream(file);

OutputStream outputStream = response.getOutputStream();

byte [] buffer = new byte[1024];

int len = 0;

while ((len = inputStream.read(buffer)) != -1){

outputStream.write(buffer, 0, len);

outputStream.flush();

}

outputStream.close();

inputStream.close();

}catch (Exception e){

e.printStackTrace();

}

}


public void download(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

String name = request.getParameter("name");

try {

response.setHeader("Content-Disposition", "attachment;fileName="+"1.jpg");

File file = new File(Constants.IMAGE_PATH + name);

FileInputStream inputStream = new FileInputStream(file);

OutputStream outputStream = response.getOutputStream();

byte [] buffer = new byte[1024];

int len = 0;

while ((len = inputStream.read(buffer)) != -1){

outputStream.write(buffer, 0, len);

outputStream.flush();

}

outputStream.close();

inputStream.close();

}catch (Exception e){

e.printStackTrace();

}

}

}


package com.qianfeng.day9.servlet;


import com.qianfeng.day9.util.Constants;


import javax.servlet.ServletException;

import javax.servlet.annotation.MultipartConfig;

import javax.servlet.annotation.WebServlet;

import javax.servlet.http.HttpServlet;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

import javax.servlet.http.Part;

import java.io.IOException;

import java.io.PrintWriter;

import java.util.UUID;


@MultipartConfig

@WebServlet("/upload")

public class UploadServlet extends HttpServlet {

@Override

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

request.setCharacterEncoding("utf-8");

Part part = request.getPart("upload");

PrintWriter out = response.getWriter();


// 文件名称

String name = UUID.randomUUID().toString().replaceAll("-", "");


part.write(Constants.IMAGE_PATH + name);


String callback = request.getParameter("CKEditorFuncNum");

out.println("");


}


@Override

protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {

doGet(req, resp);

}

}

总结

按照如上3个步骤,基本可以演示一个完整的CKEditor的使用。


上一篇:儿童讲故事APP开发方案
下一篇:PCBA自动贴片产线智能防错管控

相关文章

源码分类

热门源码

最新资讯

联系我们