• 使用ueditor实现多图片上传案例——前台数据层(Index.jsp)


    <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
    <%
    String path = request.getContextPath();
    String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
    %>
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
            "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
        <title>完整demo</title>
        <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
        <script type="text/javascript" src="jquery-1.8.3.js"></script>
        <script type="text/javascript" charset="utf-8" src="ueditor.config.js"></script>
        <script type="text/javascript" charset="utf-8" src="ueditor.all.min.js"> </script>
        
        <!--建议手动加在语言,避免在ie下有时因为加载语言失败导致编辑器加载失败-->
        <!--这里加载的语言文件会覆盖你在配置项目里添加的语言类型,比如你在配置项目里配置的是英文,这里加载的中文,那最后就是中文-->
        <script type="text/javascript" charset="utf-8" src="lang/zh-cn/zh-cn.js"></script>
        <style type="text/css">
            div{
                100%;
            }
        </style>
    </head>
    <body>
        <form action="UploadServlet" method="post" id="form_add">
       <div>
        	商品名称:<input type="text" name="name" />
        	<input type="hidden" value="" id="picture" name="picture"/>
        	
    </div>
    <div>
        <h1>完整demo</h1>
        <script id="editor" type="text/plain" style="100%; margin:0px auto;height:300px;"></script>
    </div>
     <input type="button" value="提交" id="btn_sub"/>
        </form>
    <script type="text/javascript">
    
        //实例化编辑器
        //建议使用工厂方法getEditor创建和引用编辑器实例,如果在某个闭包下引用该编辑器,直接调用UE.getEditor('editor')就能拿到相关的实例
        var ue = UE.getEditor('editor');
    
        function getContent() {
            var content = UE.getEditor('editor').getContent();
            var picture = document.getElementById("picture");
            picture.value = content;
        }
      
       
    </script>
    <script type="text/javascript">
    $(function(){
    	$("#btn_sub").click(function(){
    		getContent();
    		$("#form_add").submit();  //提交
    	});
    });
    </script>
    
    </body>
    </html>

  • 相关阅读:
    浅谈MVP与ModelViewViewModel(MVVM)设计模式
    策略模式
    C#验证码
    如何招到烂程序员
    承载和使用WCF服务
    .NET Remoting 使用总结
    基于.Net Remoting的应用程序
    HTML5 是什么?
    关于HTTP及XMLHTTP状态代码一览
    Remoting多个信道(Chennel)的注册问题
  • 原文地址:https://www.cnblogs.com/a1111/p/12816149.html
Copyright © 2020-2023  润新知