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插件. ...
随机推荐
- Django分析之导出为PDF文件
最近在公司一直忙着做exe安装包,以及为程序添加新功能,好久没有继续来写关于Django的东西了….难得这个周末清闲,来了解了解Django的一些小功能也是极好的了~ 那今天就来看看在Django的视 ...
- 说说 js String
首先说说js的字符串,说到字符串这个就和我们原来的C# 代码有区别的就是,js里面没有chart类型.就是说他里面的 “ ”和‘ ’是要表达一样的意思. 其实这个里面就有一个问题了特别实在拼接字符串的 ...
- 第三方登录分享功能-ShareSDK for iOS适配问题记录
最近app里需要添加第三方授权登陆和分享的功能,选择了ShareSDK,参考了ShareSDK文档对该SDK进行了适配,但遇到了一些问题 1.问题:分享功能点击不跳转 原因:适配iOS9添加白名单 ...
- ffmpeg 屏幕录制 so easy....
linux Linux下使用FFmpeg进行屏幕录制相对比较方便,可以使用x11grab,使用如下的命令: ffmpeg -f x11grab -s 1600x900 -r 50 -vcodec li ...
- [canvas]用canvas绘制饼状图
折线图之后又来饼状图啦~\(≧▽≦)/~啦啦啦 <!DOCTYPE html> <html lang="en"> <head> <meta ...
- 使用mutt+msmtp在Linux命令行界面下发邮件(续)
一年前写过一篇<使用mutt+msmtp在Linux命令行界面下发邮件>,但是最近想照着文中的办法解决新的问题时发现又有新的疑惑了,所以就有了今天这篇“续集”. 首先说说msmtp.如果你 ...
- Thinking in Java——笔记(16)
Arrays Why arrays are special There are three issues that distinguish arrays from other types of con ...
- 访问API安全性认证设计
1.用户POST登录(账号+密码) | |成功 |2.返回(Private key+时间戳)加密字符串+用户信息+缓存到内存中 | |发起其它请求 |3.发起请求时携带Request参数和(Reque ...
- Yii2 关闭和打开csrf 验证 防止表单多次重复提交
原文地址:http://blog.csdn.net/terry_water/article/details/52221007 1.在Yii2配置中配置所有:所有的controller都将关闭csrf验 ...
- 分析器错误消息: 未能加载类型“Automation.Web.MvcApplication”。
常见原因1 : 可能是自己手动修改了项目 ==>属性==>生成的输出路径 ,导致版本不兼容 常见员因2 : Global的 命名空间 与 项目的命名空间 不一致 常见原因3 : 查看 ...