`
max1487
  • 浏览: 103387 次
  • 性别: Icon_minigender_1
  • 来自: 南宁
社区版块
存档分类
最新评论

jquery + struts2 实现异步上传文件

    博客分类:
  • java
阅读更多

struts2上传文件是通过提交form表单的方式实现的,如果需要实现异步上传文件的话 ,就需要借助jquery的异步提交表单的功能了,要用到jquery.form.js文件。

首先要加载相关js文件:

	<script language="JavaScript" src="<%=request.getContextPath()%>/jq/jquery-1.8.3.js"></script>
	<script language="JavaScript" src="<%=request.getContextPath()%>/jq/jquery.form.js"></script>

 

form标签:

 

<form  id="upload" action="./admin/score/upload.do" method="post" enctype="multipart/form-data" >
     
	<div style="margin:30px 0px 0px 0px;">
     	<table>
     		<tr >
     			<td><label class="forminfo">上传文件:</label></td>
     			<td><input id="file" type="file" name="file" style="border: thin solid #CCCCCC;"/></td>
     			<td><input type="submit" value="提交文件" style="height:25px;width:80px;"/></td>
     		</tr>
     	</table>
     </form>

 

 

jquery代码:

 

$(function(){

     $("#upload").submit(function(){
			
			
					var first = $("#first").val();
					var second = $("#second").val();
					var third = $("#third").val();
					
					$(this).ajaxSubmit({
					data: {first:first,second:second,third:third },	
                                        dataType: "json",			
					resetForm: true,		    	 
					success: function(data) { 
			                      if(data.result != null){
			               		//根据返回信息,更新提示窗口内容
			               		$("#result").html(data.result);
			               		//显示提示窗口
						$(".tip").fadeIn(200);
			               }
			            }
			       
			        });
				}

				return false;
			});
		});

 解析:

首先获取表单的submit事件,然后在事件里调用ajaxSubmit方法,即能异步提交表单。

在方法中可以声明若干参数,按需选择

url      提交表单数据的URL

type   提交表单数据的方法get 或 post

data   需要提交的参数键值对列表

datatype   声明返回的数据类型,有xml 、json、script 三种,如果返回类型与声明的不同,则回调函数无法执行

resetForm  如果为true 则成功后重置form 表单

success   成功后的回调函数,执行成功后的操作。在我的例子里,根据返回的信息更新提示窗口的内容,然后显示提示窗口

 

最后执行完ajaxSubmit方法后,则需要return false ,以阻止页面中的form表单提交。

 

Action类中要声明对应的文件、文件名、文件类型,并有相应get 和set方法

	private File file;
	private String fileFileName;
	private String fileContentType;

 

 

最后是Action方法:

public String upload() throws FileNotFoundException{
		//获取项目上中指定的保存上传文件的文件夹路径
		String path = ServletActionContext.getServletContext().getRealPath("/upload");

		//打开上传文件输入流
		FileInputStream fis = new FileInputStream(file);
		//打开目标文件夹输出流
		FileOutputStream fos = new FileOutputStream(new File(path,fileFileName));
		
		//输入流转成字节,并用输出流写入文件
		byte[] b = new byte[1024];
		int length = 0;
		try {
			while((length = fis.read(b))!=-1){
				fos.write(b,0,b.length);   //写入文件
			}
			fis.close();
			fos.close();
		} catch (IOException e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}

		
		return SUCCESS;
	}

 

好了,文件异步上传步骤大概就是如此,希望能给学习者有一个合理的参考。

 

 

分享到:
评论

相关推荐

    jquery+struts2实现异步刷新锁需要的包

    标题中的"jquery+struts2实现异步刷新锁需要的包"表明我们需要的是一套特定的依赖包,用于整合jQuery和Struts2来实现在服务器端控制异步更新的逻辑。这通常涉及到以下组件: 1. **jQuery库**:这是JavaScript的一个...

    jquery+struts2实现文件上传

    在本文中,我们将深入探讨如何使用jQuery和Struts2框架实现文件上传功能。这是一个常见的需求,在Web应用中,用户可能需要上传图片、文档等文件。jQuery是一个轻量级的JavaScript库,提供了丰富的交互效果和API,而...

    jquery+struts2实现异步刷新实例

    本实例将详细讲解如何利用jQuery库与Struts2框架结合,实现异步刷新功能。jQuery以其简洁易用的API深受开发者喜爱,而Struts2作为Java Web开发中的MVC框架,提供了丰富的动作和结果类型,便于构建动态网站。 首先,...

    Struts2+Jquery+Ajax

    Struts2作为Controller层,通过Action类来实现业务逻辑,并通过配置文件或注解来定义Action与URL的映射关系。 Jquery是一个高效的JavaScript库,简化了HTML文档遍历、事件处理、动画以及Ajax交互。它使得开发者能更...

    struts2+ajax+jquery异步批量上传超大文件

    struts2+ajax+jquery异步批量上传超大文件,单文件最大支持2G,一次文件数量,文件大小都可设置。简单明了。绝对可用,稍微懂点的就可以修改为自己所用。你值得拥有! 我会分享给大家更多更好的东西,希望支持!

    struts2+jquery+ajax文件异步上传

    Struts2、jQuery和Ajax是Web开发中的三个关键组件,它们共同构成了文件异步上传的基础框架。这个项目是在MyEclipse环境下实现的一个简单的文件上传功能,让我们深入了解一下这些技术及其在文件上传中的应用。 首先...

    struts2+ajax+jquery异步批量上传超大文件.zip

    struts2+ajax+jquery异步批量上传超大文件.zip struts2+ajax+jquery异步批量上传超大文件.zip struts2+ajax+jquery异步批量上传超大文件.zip struts2+ajax+jquery异步批量上传超大文件.zip struts2+ajax+jquery异步...

    整合jquery+json+struts2异步提交实例

    综上所述,"整合jquery+json+struts2异步提交实例"是一个实用的Web开发教程,它演示了如何利用jQuery的Ajax功能和Struts2框架处理JSON数据,实现前后端之间的高效异步通信。这个实例可以帮助开发者更好地理解和掌握...

    jquery+struts2+upload

    总的来说,"jquery+struts2+upload"的组合是一个经典的Web开发实践,它展示了如何利用jQuery进行前端交互,通过Struts2处理后端业务,并实现文件上传这一常见的功能需求。通过理解和实践这个例子,开发者可以更好地...

    struts+jQuery+ajax文件上传带进度条

    在这个"struts+jQuery+ajax文件上传带进度条"的项目中,我们主要关注的是如何利用这些技术实现在后台处理文件上传时,前端能够显示实时的进度条效果,提升用户体验。 首先,Struts是一个基于MVC(Model-View-...

    Spring+Struts2+JQuery实现简单的登录功能

    本项目"Spring+Struts2+JQuery实现简单的登录功能"正是以此为基础,通过集成这三个组件,实现了用户登录这一基础功能。 Spring框架作为Java企业级应用的核心,它提供了依赖注入(DI)和面向切面编程(AOP)等核心...

    jquery+uploadify + struts2 + jsp 图片批量上传Demo

    在本文中,我们将深入探讨如何使用jQuery、Uploadify、Struts2和JSP技术实现一个图片批量上传的Demo。这个组合提供了高效、用户友好的文件上传解决方案,特别适合需要处理大量图片的Web应用。 首先,jQuery是一个轻...

    jQuery+json异步实现JSP和struts2之间的数据传递

    "jQuery+json异步实现JSP和struts2之间的数据传递"是一个典型的应用场景,它结合了前端JavaScript库jQuery与后端MVC框架Struts2,通过JSON这种轻量级的数据交换格式进行高效的数据交互。下面我们将详细探讨这一主题...

    JQuery+struts+hibernate实现最简洁的功能完整的分页案例

    JQuery+struts+hibernate实现最简洁的功能完整的分页案例,数据添加支持异步提交表单,css美化表格,使用动态action处理数据,源码发布即可使用无需添加任何jar包,内有数据库脚本

    jQuery+Struts+Ajax无刷新分页

    本项目采用jQuery、Struts2和Ajax技术实现了这样一个功能,用户可以在不重新加载整个页面的情况下查看不同页的数据,提高了交互效率。 ### 1. jQuery jQuery是一个强大的JavaScript库,简化了JavaScript的DOM操作...

    图书管理系统-JQuery+Struts2+JDBC

    这个系统利用了前端的CSS进行页面美化和布局,通过JQuery增强用户体验并引入AJAX技术实现异步数据交换,后端则依赖于Struts 2框架来控制业务逻辑,并用JDBC与SQL Server 2000数据库进行数据交互。 首先,CSS...

    struts2+jquery多文件上传显示进度条,可直接运行(非常强大)

    Struts2和jQuery结合实现的多文件上传功能是一种常见的Web开发技术,特别是在处理大量数据时,用户需要上传多个文件的情况。这个项目的核心是利用Struts2的Action支持和jQuery的AJAX功能,以及一个用于展示进度条的...

    SSH+jQuery+json 实现的Ajax操作,绝对精华,代码简练清晰,绝对能看明白

    这个压缩包中的资源,"SSH+jQuery+json 实现的Ajax操作,绝对精华,代码简练清晰,绝对能看明白",显然提供了一个使用这些技术实现Ajax级联操作的实例。下面将详细介绍这些技术及其在Ajax操作中的应用。 **SSH ...

    jquery + struts1 + ajax学习例子

    在IT行业中,jQuery、Struts1和Ajax是三个非常重要的技术,它们分别在网页交互、MVC框架和异步数据传输方面发挥着关键作用。这个"jquery + struts1 + ajax学习例子"提供了结合这三个技术的实践教程,帮助开发者更好...

    Jquery+Struts2笔记

    jQuery是一款轻量级的JavaScript库,以其简洁的API和强大的功能深受开发者喜爱,而Struts2作为Java企业级应用中的MVC框架,提供了模型-视图-控制器模式的实现,有助于构建结构清晰、易于维护的Web应用。本笔记将深入...

Global site tag (gtag.js) - Google Analytics