`
ainidehsj
  • 浏览: 136009 次
  • 性别: Icon_minigender_1
  • 来自: 长沙
社区版块
存档分类
最新评论

异步文件上传的两种方式

阅读更多
<%@ 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">    
	<script type="text/javascript" src="<%=path %>/script/jquery-1.4.2.min.js"></script>
	<script type="text/javascript" src="<%=path %>/script/jquery.form.js"></script>
	
	<script type="text/javascript">
		function uploadFile()
		{
			var url = "<%=path %>/file/uploadFileWithMultipartFiles.htm";
			var fm = document.getElementById("fm");
			fm.action = url;
			fm.enctype = "multipart/form-data";
			fm.target = "queryDown";
			fm.method = "GET";
			fm.submit();
		} 
		function jqFormUploadFile()
		{
			$("#fm").form('submit',{url:"<%=path %>/file/uploadFileWithMultipartFiles.htm",
				success:function(data)
				{
					$("#downfile_div").html(data);
				}
			});
		}
		$(function(){
			$("#downfile_div").load("<%=path%>/file/showFiles.htm");
		});
	</script>
  </head>
  
  
  <body>
  	<div style="width: 100%;">
  		<center>
	  		<table width="80%" border="1">
	  			<tr>
	  				<td width="50%" align="center">文件上传</td>
	  				<td width="50%" align="center">文件下载</td>
	  			</tr>
	  			<tr>
	  				<td align="center">
	  					<form id="fm" action="" method="post" enctype="multipart/form-data">
	  						<table>
	  							<tr><td>
						  			<input type="file" name="upfiles">
	  							</td></tr>
	  							<tr><td>
						  			<input type="file" name="upfiles">
	  							</td></tr>
	  							<tr><td align="center">
	  								<input type="button" value="开始上传" onclick="jqFormUploadFile()" />
	  							</td></tr>
	  						</table>
				  		</form>
	  				</td>
	  				<td align="center">
	  					<div id="downfile_div">
	  					
	  					</div>
	  				</td>
	  			</tr>
	  		</table>
  		</center>
  	</div>
	<iframe src="" name="queryDown" id="queryDown" style="display: none"></iframe>	
  </body>
</html>


分享到:
评论

相关推荐

    前后端分离实现同步/异步文件上传

    后端:springbbot 前端:vue+elementUI+axios 前后端分离方式 分别尝试同步异步两种方法进行文件上传 1

    spring mvc ajax异步文件的上传和普通文件上传

    本篇将详细讲解这两种方式的实现原理及步骤。 首先,让我们来理解一下普通文件上传。在Spring MVC中,我们可以利用`@RequestParam`注解接收上传的文件。在HTML表单中,我们需要设置`enctype="multipart/form-data"`...

    c# FTP操作类上传、异步上传文件、下载

    文件下载也支持同步和异步两种方式。同步方式下,可以使用`FtpWebRequest`对象调用`DownloadFile`或`DownloadData`方法直接下载文件。异步方式则通过`BeginDownloadFile`或`BeginDownloadData`方法启动下载过程,并...

    基于WebClient的Ftp异步文件上传

    我们将分析两种实现方式:类库版和组件版,虽然形式不同,但其核心功能和效果是一致的。 首先,了解`WebClient`类。`WebClient`是.NET内置的类,它提供了一组方法和属性,用于执行常见的Web请求,如下载和上传文件...

    jquery php 文件异步上传

    文件上传通常有两种方式:传统的表单提交(Form)和异步(Ajax)方式。在"form.php"中,文件是通过HTML的`&lt;form&gt;`元素,配合`enctype="multipart/form-data"`属性来实现上传的。用户选择文件后,点击提交按钮,...

    文件上传的两种情况及mock时对应处理办法

    本文将详细讨论文件上传的两种常见情况以及在mock(模拟)时如何进行对应的处理。 一、文件上传的两种情况: 1. **表单提交方式(Form Data)**: 这是最传统的文件上传方式,通过HTML的`&lt;form&gt;`标签,设置`...

    AJAXFileUpload ajax 异步文件上传

    在现代Web应用中,异步文件上传已经成为一种常见的需求,特别是在需要实时交互和用户体验优化的场景下。AJAXFileUpload是实现这一功能的一种技术手段,它利用Ajax技术实现了文件的无刷新上传,同时结合进度条展示,...

    jquery文件上传例子(两种方式)

    标题 "jquery文件上传例子(两种方式)" 涉及到的是使用jQuery库进行文件上传的实践,这在Web开发中是非常常见的需求。jQuery是JavaScript的一个轻量级库,它简化了DOM操作、事件处理和Ajax交互等任务。在这个示例中,...

    基于node后台HTML5异步上传+FLASH异步上传四种方法.zip

    在"node-upload-master"这个压缩包中,可能包含了一个Node.js项目,用于演示上述两种上传方式的实现。文件夹可能包括了服务器端代码(如app.js)、前端HTML页面、JavaScript脚本(可能包括HTML5和Flash两种上传的...

    swift-上传工具封装并行异步多张上传串行异步按顺序一张张上传

    在Swift中,我们可以利用GCD(Grand Central Dispatch)或者OperationQueue来实现这两种异步上传策略。 1. **并行异步多张上传**: 使用GCD,我们可以创建一个DispatchQueue,并设置其为concurrent类型,然后将每...

    三种文件批量上传方法 包含服务器端代码 带进度条

    本资源提供的是三种不同的文件批量上传方法,其中包括单文件上传和多文件上传,并且都带有进度条功能,这对于提升用户体验至关重要。下面将详细阐述这些知识点。 1. **单文件上传**: 单文件上传是基本的文件上传...

    aspnet上传文件的两种方式 普通html控件 服务器控件

    无论选择哪种方式,都需要注意文件上传的安全问题。例如,限制文件类型、大小,防止路径遍历攻击,以及确保上传的文件不会破坏服务器的正常运行。在实际应用中,通常会结合使用验证控件和代码逻辑来确保安全性。 ...

    Qt之 Post方法上传图片到服务器两种方式Base64流和File

    下面将详细讲解这两种方式的实现过程及其特点。 首先,我们来看Base64编码流的方式。Base64是一种将二进制数据转换为可打印ASCII字符的编码方式,常用于在网络上传输图像等非文本数据。在Qt中,可以使用`QByteArray...

    Python文件上传两种方法对比

    本篇文章将对比两种主要的文件上传方法,帮助开发者更好地理解它们的差异和适用场景。 第一种方法:基于HTML表单的传统文件上传 在传统的文件上传方式中,我们通常会使用HTML的`&lt;form&gt;`标签,并设置`enctype`属性...

    5.html5拖拽异步上传文件.zip

    HTML5是现代网页开发的重要标准,它引入了许多新特性,其中拖放(Drag and Drop)功能和异步文件上传是两个显著的增强。在“5.html5拖拽异步上传文件.zip”中,我们主要探讨如何利用这些特性来实现用户友好的文件...

    jQuery Uploadify + Apache Fileupload异步上传文件示例

    Fileupload提供了流式和内存两种处理方式,以适应不同大小的文件上传需求,确保上传的稳定性。 3. 集成过程: - 首先,在前端,你需要引入jQuery和jQuery Uploadify的JS及CSS文件,配置Uploadify的选项,如选择...

    Java实现文件与图片的上传下载---三种方式

    这个组件是基于Commons IO和Commons FileUpload两个库,提供了一套完整的文件上传解决方案。在Servlet中,我们需要配置MultipartConfigElement,并在处理请求时创建DiskFileItemFactory和ServletFileUpload对象。...

    C# .NET FileUpload 多文件上传例子

    在这个"C# .NET FileUpload 多文件上传例子"中,我们将探讨两种主要的方法,帮助你理解和掌握这一关键功能。 首先,我们要知道ASP.NET中的`&lt;asp:FileUpload&gt;`控件是实现文件上传的核心组件。它可以允许用户从本地...

    JSP多文件上传(同时上传)

    "JSP多文件上传"是一个常见的需求,特别是在文件分享、在线教育或文档管理等场景。这个功能允许用户一次性选择并上传多个文件,提高了用户体验,减少了多次点击和等待时间。 实现JSP多文件上传,我们需要了解以下几...

    通用 万能 HttpHandler webRequest 文件上传

    在ASP.NET中,通常有两种主要的方法来实现文件上传:使用表单的`&lt;input type="file"&gt;`元素配合POST请求,或者通过HTTP的PUT方法。这里提到的HttpHandler结合HttpWebRequest,提供了一种更底层且可能更灵活的文件上传...

Global site tag (gtag.js) - Google Analytics