struts2 jquery ajaxFileUpload 异步上传文件
网上搜集的,整理一下。
一.ajaxFileUpload 实现异步上传文件利用到了ajaxFileUpload.js这个文件,这是别人开发的一个jquery的插件,可以实现文件的上传并能够和struts2框架和好的融合在一起。但是网上的提供的一些ajaxFileUpload.js插件存在一些问题,不能够实现多次点击上传文件,要想再次上传必须重新刷新页面。在网上找了好久才找到真正的解决方案,有些网友给出的解决方案并没有真正的解决问题,不知到什么原因。我的修改:
原文件:
var oldElement = $('#' + fileElementId);
var newElement = $(oldElement).clone();
$(oldElement).attr('id', fileId);
$(oldElement).before(newElement);
$(oldElement).appendTo(form);
作如下修改:
var oldElement = $('#' + fileElementId);
var newElement = $(oldElement).clone();
var newElement = $(oldElement).clone(true);
$(oldElement).attr('id', fileId);
$(oldElement).before(newElement);
$(oldElement).appendTo(form);
即添加这一句话:var newElement = $(oldElement).clone(true);
关于.clone()和.clone(true)的区别,这个链接给出了解释:http://blog.baiwand.com/?post=27
下面是关于ajaxFileUpload的具体使用:
options参数说明:
1、url 上传处理程序地址。
2,fileElementId 需要上传的文件域的ID,即<input type="file">的ID。
3,secureuri 是否启用安全提交,默认为false。
4,dataType 服务器返回的数据类型。可以为xml,script,json,html。如果不填写,jQuery会自动判断。
5,success 提交成功后自动执行的处理函数,参数data就是服务器返回的数据。
6,error 提交失败自动执行的处理函数。
7,data 自定义参数。这个东西比较有用,当有数据是与上传的图片相关的时候,这个东西就要用到了。
8, type 当要提交自定义参数时,这个参数要设置成post
具体代码:
$.ajaxFileUpload({
type:"post",
secureuri:false,
url:'uploadFile.action',
fileElementId:'fileupload',
success:function(data,status){
},
error:function(data,status,e){
alert("上传文件失败,请重新上传或刷新页面在上传!");
},
});
二。在做ajaxFileUpload时,由于jquery 版本问题 发生 jQuery.handleError is not a function。应该是导入的jquery版本高于1.4+了,1.5+jquery重写过ajax部分内容,已经删除handleError这个方法,但是ajaxfileupload还是使用旧版本的jquery,既1.5以下的jquery方法handleError,所以报错。
handleError: function( s, xhr, status, e ) {
// If a local callback was specified, fire it
if ( s.error ) {
s.error.call( s.context || s, xhr, status, e );
}
// Fire the global callback
if ( s.global ) {
(s.context ? jQuery(s.context) : jQuery.event).trigger( "ajaxError", [xhr, s, e] );
}
},
三.关于input中type="file"的自动提交上传的文件的解决方法;即监听input的change()时间:
$("#fileupload").change(function(){});
struts2 jquery ajaxFileUpload 异步上传文件的更多相关文章
- jquery ajaxFileUpload异步上传文件
ajaxFileUpload.js 很多同名的,因为做出来一个很容易. 我用的是这个:https://github.com/carlcarl/AjaxFileUpload 下载地址在这里:http:/ ...
- 【转】JQuery插件ajaxFileUpload 异步上传文件(PHP版)
前几天想在手机端做个异步上传图片的功能,平时用的比较多的JQuery图片上传插件是Uploadify这个插件,效果很不错,但是由于手机不支持flash,所以不得不再找一个文件上传插件来用了.后来发现a ...
- JQuery插件ajaxFileUpload 异步上传文件(PHP版)
太久没写博客了,真的是太忙了.善于总结,进步才会更快啊.不多说,直接进入主题. 前几天想在手机端做个异步上传图片的功能,平时用的比较多的JQuery图片上传插件是Uploadify这个插件,效果很不错 ...
- HTML5 jQuery+FormData 异步上传文件,带进度条
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <link href ...
- JQuery插件ajaxFileUpload 异步上传文件
一.先对ajaxFileUpload插件的语法参数进行讲解 原理:ajaxfileupload是通过监听iframe的onload方法来实现, 当从服务端处理完成后,就触发iframe的onload事 ...
- 基于struts2的ajaxfileupload异步上传插件的使用
服务器端采用struts2来处理文件上传. 所需环境: jquery.js ajaxfileupload.js struts2所依赖的jar包 及struts2-json-plugin-2.1.8.1 ...
- ajaxfileupload异步上传文件
ajaxfileupload插件可以以异步方式上传文件(其实现:iframe),不像传统那样需要刷新,下面就介绍下其使用 1.HTML部分(先引入jquery): <!DOCTYPE html& ...
- Jquery.form异步上传文件常见问题解决
Jquery.form常用方法我就不多说,主要说一下在使用过程中碰到的问题 1.提示 “xxxx” is not define 或者"xxx" is not a function ...
- 异步上传文件,ajax上传文件,jQuery插件之ajaxFileUpload
http://www.cnblogs.com/kissdodog/archive/2012/12/15/2819025.html 一.ajaxFileUpload是一个异步上传文件的jQuery插件. ...
随机推荐
- Spark 自定义累加变量(Accmulator)AccumulatorParam
1.创建一个累加变量 public <T> Accumulator<T> accumulator(T initialValue, AccumulatorParam<T&g ...
- BZOJ2705: [SDOI2012]Longge的问题
Description Longge的数学成绩非常好,并且他非常乐于挑战高难度的数学问题.现在问题来了:给定一个整数N,你需要求出∑gcd(i, N)(1<=i <=N). Input 一 ...
- 2016 CCPC 东北地区重现赛
1. 2016 CCPC 东北地区重现赛 2.总结:弱渣,只做出01.03.05水题 08 HDU5929 Basic Data Structure 模拟,双端队列 1.题意:模拟一个栈的操 ...
- Linux下面桌面的安装
挂载光盘后配置yum文件,配置后 使用yum grouplist 命令 查看组 用yum install '"GNOM桌面组 输入 init 5 即可进入桌面模式 0 关机 3命令行级 ...
- python 进程和线程
python中的进程.线程(threading.multiprocessing.Queue.subprocess) Python中的进程与线程 学习知识,我们不但要知其然,还是知其所以然.你做到了你就 ...
- C++11 auto and decltype
1.auto关键字 C++新标准引入auto关键词,此auto与之前C语言的auto意义已经不一样了. 这里的auto是修饰未知变量的类型,编译器会通过此变量的初始化自动推导变量的类型. 例如:aut ...
- GIT如何添加权限模块
http://blog.chinaunix.net/uid-15174104-id-3843570.html
- 被swoole坑哭的PHP程序员
被swoole坑哭的PHP程序员 2015-09-16 09:57 文帅营 博客园 字号:T | T 首先说一下对swoole的理解:披着PHP外衣的C程序.很多PHPer朋友看到swoole提供的强 ...
- 获取真实Ip地址
/** * @author zhoulongqin * @see 获取客户端ip * @param * @return 客户端ip(String) webserve ip不一定获取的到 */ publ ...
- vert.x学习(二),使用Router来定义用户访问路径
这里需要用到vertx-web依赖了,依然是在pom.xml里面导入 <?xml version="1.0" encoding="UTF-8"?> ...