jQuery插件ajaxFileUpload异步上传文件

ajaxFileUpload.js

很多同名的，因为做出来一个很容易。 我用的是这个https://github.com/carlcarl/AjaxFileUpload 下载地址在这里：

AjaxFileUpload.js并不是一个很出名的插件，只是别人写好的放出来供大家用，原理都是创建隐藏的表单和iframe然后用JS去提交，获得返回值。

当初做了个异步上传的功能，选择它因为它的配置方式比较像jQuery的AJAX，我很喜欢。

评论里面说到的不行。那是因为我们用的不是同一个js。我上github搜AjaxFileUpload出来很多类似js。

ajaxFileUpload是一个异步上传文件的jQuery插件

传一个不知道什么版本的上来，以后不用到处找了。

语法：

options参数说明：

1、url　　　　　　　　　　 上传处理程序地址。　　 2，fileElementId　　　　　 需要上传的文件域的ID，即

错误提示:

1、SyntaxError: missing ; before statement错误 　　如果出现这个错误就需要检查url路径是否可以访问 2、SyntaxError: syntax error错误 　　如果出现这个错误就需要检查处理提交操作的服务器后台处理程序是否存在语法错误 3、SyntaxError: invalid property id错误 　　如果出现这个错误就需要检查文本域属性ID是否存在 4、SyntaxError: missing } in XML expression错误 　　如果出现这个错误就需要检查文件name是否一致或不存在 5、其它自定义错误 　　大家可使用变量$error直接打印的方法检查各参数是否正确，比起上面这些无效的错误提示还是方便很多。

使用方法：

第一步：

先引入jQuery与ajaxFileUpload插件。注意先后顺序，这个不用说了，所有的插件都是这样。

第二个例子

使用ajaxFileUpload上传文件时,有时需要带参数提交,网上有很多资料说使用data,但其实要使用data带参数是需要修改的,否则后台是获取不到的.

分析原因：

ajaxFileUpload为了实现无刷新异步提交文件,构建 iframe 然后创建form表单 再将要上传的文件写上去再提交.但是原代码 却没有处理data.所以这块内容需要我们自己加上去. 下面红色部分为修改ajaxFileUpload.js的三处地方:

备注:好像csdn代码中加颜色加粗 有问题这三处修改的地方我直接贴出来,位置看下面的代码,

①

②').appendTo(form); } }

③

ajaxFileUpload为了实现无刷新异步提交文件,构建 iframe 然后创建form表单 再将要上传的文件写上去再提交.但是原代码 却没有处理data.所以这块内容需要我们自己加上去. 下面红色部分为修改ajaxFileUpload.js的三处地方: 备注:好像csdn代码中加颜色加粗 有问题这三处修改的地方我直接贴出来,

if (data) {
for (var i in data) {
$('').appendTo(form);
}
}

var form = jQuery.createUploadForm(id,s.data);

如何使用它呢？

html：

获取文件并分行读取(非图片):

try {
InputStream inputStream=multipartFile.getInputStream();
BufferedReader reader = new BufferedReader(new InputStreamReader(inputStream));
String tempString = null;

// 一次读入一行，直到读入null为文件结束
while ((tempString = reader.readLine()) != null) {
fileList.add(tempString);
}
} catch (IOException e2) {
// TODO Auto-generated catch block
e2.printStackTrace();
}

使用过程中有两点需要注意的地方： 其一，dataType必须要大写； 其二，在data的值要写成json的格式，否则后台无法接受参数

更多精彩内容请参考专题，和进行学习。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持编程之家。

原文地址：https://www.jb51.cc/jquery/45049.html