富文本编辑器 kindeditor 的使用

因为最近要做一个学校的项目,重新复习一下富文本编辑器的使用

1.下载kindeditor :直接去官网下载

2.导入

    下载解压完之后是这样的:

    

   除了asp,asp.net,php 其余的直接ctrl+v 到webapp下 即可

  3.引入:

   src依具体的文件位置而定

   4.

    初始化:

5.调用:

    

文件图片上传:

    注意我们在上面初始化时候写的 :'/upload' 后端的代码是这样的:

    代码很粗陋异常什么的都没catch,只是为了快速复习一下,因此各位自行补全,但是能完成上传,同时多图片上传也能成功,当多图片上传,点击开始上传的时候:

    其实是一个循环提交图片的过程,因此这个方法不需要更改也是可以的

	@RequestMapping("/upload")
	@ResponseBody
	public void upload(@RequestParam("imgFile")MultipartFile file, HttpServletRequest request,HttpServletResponse response) throws FileUploadException, IOException
	{
		
		MultipartHttpServletRequest request2=(MultipartHttpServletRequest) request;

		PrintWriter writer = response.getWriter();
		if(!file.isEmpty())
		{
			String realPath = request.getServletContext().getRealPath("/");
			String savePath=realPath+"imgs/";
			SimpleDateFormat  simpleDateFormat=new SimpleDateFormat("yyyyMMdd");
			String dateName = simpleDateFormat.format(new Date());
			savePath+=File.separator+dateName;
			File file2=new File(savePath);
			if(!file2.exists())
			{
				file2.mkdirs();
			}
			String name = UUID.randomUUID().toString().substring(0,5);
			String suffix = file.getOriginalFilename().substring(file.getOriginalFilename().lastIndexOf('.'));
			File newFile=new File(savePath+File.separator+name+suffix);
			if(!newFile.exists())
			{
				newFile.createNewFile();
			}
			file.transferTo(newFile);
			JSONObject jsonObject=new JSONObject();
			jsonObject.put("error", 0);
			jsonObject.put("url", request.getContextPath()+"/imgs/"+dateName+"/"+newFile.getName());
			writer.write(jsonObject.toString());
		}
	}