文件上传功能+富文本页面!!!!!!!!!!!!!!!!

Posted 程序不是生活的全部,但生活中一定要有程序

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了文件上传功能+富文本页面!!!!!!!!!!!!!!!!相关的知识,希望对你有一定的参考价值。

一:文件上传功能

1:首先在index.jsp的界面上初始化一个表单。

<body>
        <form  enctype="multipart/form-data" action="<%=path%>/1.jsp" method="post">
            姓名:<input type="text" name="username"/>
  选择文件:<input type="file" name="myfile"/>
      <input type="submit" value="提交"/>
        </form>
</body>

:enctype=多部分的表单数据,并且如果form表单的属性中多了enctype="multipart/form-data",是不能使用request.getParameter(name属性的)

2:在WEB-ROOT的根目录下创建一个1.jsp,实现文件上传功能!

<%@page import="java.io.File"%>
<%@page import="org.apache.commons.fileupload.FileItem"%>
<%@page import="org.apache.commons.fileupload.disk.DiskFileItemFactory"%>
<%@page import="org.apache.commons.fileupload.servlet.ServletFileUpload"%>
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
   //判定request请求的类型
     request.setCharacterEncoding("utf-8");
    boolean flag= ServletFileUpload.isMultipartContent(request);
     if(flag)
     {
         DiskFileItemFactory factory=new DiskFileItemFactory();
        //找到一个解析器,解析请求中的各个项目
         ServletFileUpload upload=new ServletFileUpload(factory);//解析器的创建
         List<FileItem> list=upload.parseRequest(request);//使用解析器解析请求的数据
         Iterator<FileItem> myitor= list.iterator();//自动迭代的功能
         while(myitor.hasNext())
         {
                FileItem item=myitor.next();
                if(item!=null)
                {
                  //判断FileItem对象封装的数据类型,文件表单或普通表单字段
                  if(item.isFormField())//普通表单
                  {
                   String name= item.getFieldName();//获取表单的name属性
                   if(name.equals("username"))
                   {
                      out.print(item.getString("utf-8"));
                   }
                  }
                  else
                  {
                    String name=item.getName();//获得文件名
                    out.print(name);
                    String path="/WEB-INF/upload/";//相对路径名
                    String path2=this.getServletContext().getRealPath(path);//通过相对路径名来获得绝对路径名
                    out.print(path2);
                    File file=new File(name);
                    File uploadpath=new File(path2,file.getName());
                    item.write(uploadpath);//向该路径写入文件
                    out.print("上传成功");
                  }
                }
         }
     }

 %>

二:富文本文件

1:创建一个moneyText.jsp页面,将下载的ckeditor文件夹copy到WEB-INF文件夹下

 <script type="text/javascript" src="ckeditor/ckeditor.js"></script>
  <body>
  <form action="/fileInfo/success.jsp" method="post">
    <textarea class="ckeditor" name="txtConent"></textarea>
    <input type="submit" value="提交"/>
    
  </form>
</body>

2:创建一个sucess页面用来展示从moneyText.jsp富文本传递过来的数据

 <%
         request.setCharacterEncoding("utf-8");
   %>
  <script type="text/javascript" src="ckeditor/ckeditor.js"></script>
  <body>
    <textarea class="ckeditor" name="Conent"><%=request.getParameter("txtConent")%></textarea>
  </body>

 

以上是关于文件上传功能+富文本页面!!!!!!!!!!!!!!!!的主要内容,如果未能解决你的问题,请参考以下文章

类百度富文本编辑器文件上传。

使用KindEditor富文本编译器实现图片上传并回显

PHP ckeditor富文本编辑器 结合ckfinder实现图片上传功能

KindEditor - 富文本编辑器 - 使用+上传图片

ueditor单独调用上传附件和图片的功能

系统 v5.5.0 富文本粘贴上传,后台事件功能升级