zoukankan      html  css  js  c++  java
  • Web <input type="file"> FormData 多文件上传

    <%@ 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">
    <html>
    
    <head>
        <base href="<%=basePath%>">
    
        <title>多文件上传</title>
    
        <meta http-equiv="pragma" content="no-cache">
        <meta http-equiv="cache-control" content="no-cache">
        <meta http-equiv="expires" content="0">
        <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
        <meta http-equiv="description" content="This is my page">
        
        <script type="text/javascript" src="js/jquery-easyui-1.6.6/jquery.min.js"></script>
        <script type="text/javascript" src="js/jquery-easyui-1.6.6/jquery.easyui.min.js"></script>
    </head>
    
    <body>
        <!-- 可以选择多个文件:multiple="multiple";accept:设置可选择的文件类型,用“,”分割多种类型 -->
        <input type="file" id="selectFiles" multiple="multiple" accept=".xml">
        <input type="button" value="上传" onclick="uploadFromLocalToServer()">
    </body>
    
    </html>
    <script type="text/javascript">
        function uploadFromLocalToServer(){
            //获取选中的文件
            var files = document.getElementById("selectFiles").files;
            
            //创建FormData对象
            var formdata = new FormData();
            //设置formdata
            for(var i=0;i<files.length;i++){
                formdata.append("file["+ i +"]", files[i]);
            }
            
            //上传文件
            $.ajax({
                url: "communication!UploadFileService.action",
                type: 'POST',
                data: formdata,
                dataType: 'json',
                async: false,
                contentType: false,
                processData: false,
                success: function (data) {
                    alert(JSON.stringify(data));
                    if (data.success == "ok") {
                        alert("上传成功");
                    } else {
                        alert("上传失败");
                    }
                }
            });
        }
    </script>
  • 相关阅读:
    linux 学习之七-部分ssh命令
    揭秘淘宝286亿海量图片存储与处理架构
    大型网站后台架构的演变
    Linux学习之六-Yum命令的使用
    res://ieframe.dll/acr_error.htm 纯手动解决方法
    VS2013启动项目调试的时候会启动本地IIS
    linux学习之(六)-主机名、网络IP的配置与查看
    deployment.yaml 带同步时区
    Deployment
    mysql.yaml
  • 原文地址:https://www.cnblogs.com/qq450867541/p/12432543.html
Copyright © 2011-2022 走看看