• 几款js工具的使用


    1.副文本编辑器umeditor          

               下载地址:http://ueditor.baidu.com/website/download.html

        使用:

           1.webRoot下面创建一个umeditor的文件夹,将解压后的所有文件拷贝到此

          2.jsp文件夹里的jar包拷贝到WEB-INF/lib目录下

          3.在页面上引入编辑器

          <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/umeditor/themes/default/css/umeditor.css" />
          <script type="text/javascript" src="${pageContext.request.contextPath}/umeditor/third-party/jquery.min.js"></script>
          <script type="text/javascript" src="${pageContext.request.contextPath}/umeditor/third-party/template.min.js"></script>
          <script type="text/javascript" charset="utf-8" src="${pageContext.request.contextPath}/umeditor/umeditor.config.js"></script>
          <script type="text/javascript" charset="utf-8" src="${pageContext.request.contextPath}/umeditor/umeditor.min.js"></script>
          <script type="text/javascript" src="${pageContext.request.contextPath}/umeditor/lang/zh-cn/zh-cn.js"></script>

           4.在页面上使用script标签实例化一个文本编辑器

          <script type="text/plain" id="vcontent" name="content"
            style="700px;height:350px;padding: 0px;margin:opx,auto;">${v.vcontent}</script>
          <script type="text/javascript">
            var um=UM.getEditor('vcontent');
          </script>

           5.其他设置

            

                在umeditor.config.js中列出了所有的工具栏按钮,可以根据需要重新定义工具栏按钮

                  

              例如,实例化编辑器时,要去掉underline strikethroughsuperscript subscript则配置toolbar的值:

                  

         

                Umeditor支持在编辑区上传文件,在需要实例化编辑器的页面加载函数里写上如下代码:               window.UMEDITOR_HOME_URL = "/项目名/umeditor/";       这样就可以正常上传图片了

              

                 如果需要配置自定义的路径,请找到如下配置代码修改即可

                

    2.文件上传,servlet接受

           表单设计:

          <form action="sf" enctype="multipart/form-data" method="post">

            用户名: <input type="text" name="username" /><br> 

            文件1: <input type="file" name="file_0" /><br> 

            文件2: <input type="file" name="file_1" /><br>

             <input type="submit" value="上传" />

          </form>

      后台Servlet处理:  

           1.Servlet上增加支持文件上传的注解 @multipartConfig

          2.通过request,getparts()获得表单参数获得 parts   集合,

         3. 找到上传文件对应的part

           通过遍历集合里面的每一个元素part,通过part.getName()方法获得每个表单元素对应的name名字,通过比较name值找到上传文件的表单元素,

         4.获取上传文件的文件名       

          通过part的getHeader方法,传入content-disposition参数,获取请求头对应的字符串,再通过字符串截取操作获取文件名

         5、得到文件上传后的路径

            通过request.getRealPath("上传文件的文件夹")+"/";获取服务器存储文件文件夹的真实物理路径,然后加上文件名就成为了文件上传到服务器后的真实物理路径

         6.调用part.write(服务器路径)就成功的将文件上传到服务器了

     

  • 相关阅读:
    Java构造和解析Json数据的两种方法详解一
    微信小程序-自定义组件
    微信小程序
    微信公众号
    微信小程序
    微信小程序
    微信小程序
    vue
    vue
    sass 和 css 互转网址
  • 原文地址:https://www.cnblogs.com/pcyiren/p/9241146.html
Copyright © 2020-2023  润新知