网站内容编辑器(富文本编辑器，以及图片的上传与展示操作与操作)

　　网站内容编辑器(富文本编辑器，以及图片的上传与展示操作与操作)

　　大家晚上好！

　　今天给大家带来的是我们最常用的——富文本编辑器，以及图片上传和展示操作

　　一、富文本编辑器

　　什么是富文本编辑器及其作用：

　　通俗点其实就是我们平时使用的输入法，它让我们不仅可以提交文字，还可以提交网页中的符号、表情等文本框。

　　使用方法：

　　1.去官方网站下载文件：百度搜索ckeditor进入官网

　　2.点击文档[学习安装解压]

　　3.将文件夹复制到项目中

　　4.在需要使用的页面中引入ckeditor.js，如下：

　　5.在原文本框位置下方写下这段代码：（文本框中的名称值必须与其替换值相同）

　　<p>

内容

CKEDITOR.replace( &#39;ncontent&#39; );

</p>

　　之后就可以发送各种内容了！

　　二、使用Smartupload进行文件上传

　　首先我们需要在文本框所在的表单头部写上：enctype="multipart/form-data"***（图片的二进制方式提交）

　　写的时候要小心，输入错误无效

　　如果需要上传多个文件，在文件选择器的位置添加代码：multiple="multiple"

　　 上传图片

　　接下来点击提交，跳转到纯逻辑页面：

　　我们需要

　　1.实例化和初始化 SmarUpload

　　2.上传图片到服务器内存的一些相关要求如何上传

　　3.获取所有文件和文件总数

　　4.定义进入循环的路径

　　5.提交路径等提交内容到数据库

　　这些步骤放在这段代码中：

<p> //实现文件上传

//--自动获取Web项目的根目录

//实例化

SmartUpload su=new SmartUpload();

//初始化 pageContext属于九大内置对象之一 作用域仅限于当前页面

su.initialize(pageContext);

//设置相关要求

su.setCharset("utf-8");

su.setAllowedFilesList("jpg,png,gif,jpeg");//允许文件上传类型列表

su.setDeniedFilesList("exe,jsp,bat");//禁止上传文件类型列表

su.setMaxFileSize(512*512);//文件大小

//上传到服务器内存

su.upload();

//实现多文件上传

//拿到所有的文件

Files fs=su.getFiles();

//拿到上传的总数目

int m=fs.getCount();

String path="";

//循环

for(int i=0;i