ajaxfileupload是一款jQuery插件,用来实现文件的ajax方式上传功能。
下载地址:
http://www.phpletter.com/download_project_version.php?version_id=6
在页面中使用ajaxfileupload其实很简单,在页面加入如下JavaScript代码:
function ajaxFileUpload()
{
$.ajaxFileUpload
(
{
url:'/ajax/upload.action',
secureuri:false,
fileElementId:'fileToUpload',
dataType: 'json',
success: function (data, status)
{
if(typeof(data.error) != 'undefined')
{
if(data.error != '')
{
alert(data.error);
}else
{
alert(data.msg);
}
}
},
error: function (data, status, e)
{
alert(e);
}
}
)
return false;
}
下载下来的包中有一个例子,不过服务器是PHP。我们需要在服务器端使用Struts2,并且需要struts2返回json结果,因此struts2需要json插件,下载地址:
http://jsonplugin.googlecode.com/files/jsonplugin-0.33.jar
struts.xml配置中的Action结果类型:
<action name="upload" class="...">
<param name="contentType" value="text/html"/>
<result type="json"></result>
</action>
其中,contentType参数是一定要有的,否则浏览器总是提示将返回的JSON结果另存为文件,不会交给ajaxfileupload处理。这是因为struts2 JSON Plugin默认的contentType为application/json,而ajaxfileupload则要求为text/html。
分享到:
相关推荐
1. 引入必要的库:在HTML页面中,我们需要引入jQuery、AJAXFileUpload插件以及Struts2的JavaScript文件,确保所有依赖项都已加载。 2. 创建文件上传表单:设计一个包含文件输入控件的HTML表单,但要注意不要提交表单...
在本文中,我们将深入探讨如何将jQuery插件AjaxFileUpload与Struts2框架结合,以实现异步图片上传的功能。这种技术在现代Web应用中非常常见,它提升了用户体验,允许用户在不刷新整个页面的情况下上传文件,特别是...
在本文中,我们将详细介绍如何使用Struts 2和AjaxFileUpload组件来实现在Web应用程序中进行图片的上传与预览。 一、Struts 2 框架简介 Struts 2是一个基于MVC设计模式的Action驱动的框架,它提供了强大的控制器层,...
Struts2提供了struts2-jquery-plugin,这是一个基于jQuery的插件,包含了AjaxFileUpload组件。你需要在pom.xml或build.gradle中添加依赖,或者将对应的jar文件添加到项目的类路径中。 接下来,我们创建一个Struts2 ...
在Struts2中实现异步文件上传,可以显著提高用户体验,因为用户不需要等待整个页面刷新就能看到上传进度或者结果。这种方式通常涉及到JavaScript、Ajax以及服务器端处理。下面将详细讨论这个主题。 1. **Struts2...
点我下载工程代码 由于项目需求,在处理文件... 所需环境: jquery.js ajaxfileupload.js struts2所依赖的jar包 及struts2-json-plugin-2.1.8.1.jar 编写文件上传的Action 代码如下: package com.ajaxfile.action; imp
在本文中,我们将探讨如何使用jQuery的ajaxfileupload插件实现异步文件上传,并结合Struts2框架进行处理。这个插件提供了一种方便的方法,允许用户在不刷新页面的情况下上传文件,提升用户体验。 首先,要使用...
在本文中,我们将深入探讨如何使用`ajaxFileUpload`与`Struts2`框架结合,实现多文件上传功能。这个示例源码提供了一个实用的方法,使得用户可以在不刷新整个页面的情况下,上传多个文件,提高了用户体验。 首先,`...
4. **AjaxFileUpload**:这是一个jQuery插件,专门用于处理文件上传。它扩展了Ajax的功能,使得可以方便地上传文件。AjaxFileUpload支持多文件选择、进度条显示、文件类型检查等功能,简化了开发者实现文件上传的...
- 使用jQuery监听文件输入元素的点击事件(或其他适当的事件),在事件处理函数中调用`$.ajaxFileUpload`方法实现异步上传。 3. **文件校验**:在上传之前,插件支持对文件的类型、大小、尺寸等进行校验。这对于...
在本例中,我们使用了`ajaxfileupload.js`,这是一个jQuery插件,它扩展了jQuery的Ajax功能,支持文件上传。以下是如何在HTML页面中使用这个插件的示例: ```html <!DOCTYPE html> <script src="jquery.min.js">...
这个项目是基于jQuery的imgAreaSelect插件、ajaxfileupload.js以及Struts2框架来完成这一功能的。接下来,我们将深入探讨这些关键技术点。 首先,jQuery imgAreaSelect是一个强大的JavaScript插件,它允许用户在...
- `canPushToItv.js`和`ajaxfileupload.js`可能是用于前端交互的JavaScript文件,特别是`ajaxfileupload.js`可能是一个用于异步文件上传的库,如jQuery的AjaxFileUpload插件。 - 这些脚本负责捕获表单数据,发送...
本文主要介绍如何在JSP项目中使用`ajaxFileUpload.js`插件解决跨域文件上传的问题,并提供了一个具体的示例代码,包括前端JS部分以及后端JSP和Struts2相关的处理逻辑。通过这个例子,我们可以深入了解整个跨域文件...
在Struts2中,实现文件上传和下载功能是常见的需求,这对于处理用户交互,如提交表单、交换大文件等,至关重要。下面我们将深入探讨如何在Struts2中实现这些功能,并基于提供的文件名称来解析关键知识点。 首先,...
一是插件ajaxfileupload.js里接收file文件ID的方式 二是后台action是数组形式接收 1、ajaxFileUpload文件下载地址http://www.phpletter.com/Demo/AjaxFileUpload-Demo/ 2、引入jquery-1.8.0.min.js、ajaxFileUpload....