ajaxfileupload.js实现文件异步上传

前端之家收集整理的这篇文章主要介绍了ajaxfileupload.js实现文件异步上传前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

html中:

  1. var param = $("#inputForm").serialize();
  2. url = $("#inputForm").attr("action");
  3. $.ajaxFileUpload({
  4. url: url,secureuri: false,fileElementId: 'biCardFile'
  5. dataType: 'json',success: function (data,status) {
  6. if (data.result == '0') {
  7. layer.alert(data.resultMsg,1,function() {
  8. $("#searchForm",window.parent.document).attr("action","${ctx}/merchant/merchantIdentity/");
  9. $("#searchForm",window.parent.document).submit();
  10. });
  11. } else {
  12. layer.alert(data.resultMsg);
  13. }
  14.  
  15. },error: function (data,status,e) {
  16. layer.alert("修改失败");
  17. }
  18. });
注意:form表单的提交方式method="post";enctype="multipart/form-data"
另外:有童鞋修改js代码支持文件异步上传,区别为fileElementId后面的参数
  1. var param = $("#inputForm").serialize();
  2. url = $("#inputForm").attr("action");
  3. $.ajaxFileUpload({
  4. url: url,fileElementId: ['biCardFile','taxCardFile','orgCardFile'],dataType: 'json',e) {
  5. layer.alert("修改失败");
  6. }
  7. });
  1. //修改
  2. //if(fileElement == null)
  3. //oldElement = jQuery('#' + fileElementId[i]);
  4. //else
  5. //oldElement = fileElement;
  6. //var newElement = jQuery(oldElement).clone();
  7. //jQuery(oldElement).attr('id',fileId);
  8. //jQuery(oldElement).before(newElement);
  9. //jQuery(oldElement).appendTo(form);
  10. //修改
  11. for(var i in fileElementId){
  12. if(fileElement == null)
  13. oldElement = jQuery('#' + fileElementId[i]);
  14. else
  15. oldElement = fileElement;
  16. var newElement = jQuery(oldElement).clone();
  17. jQuery(oldElement).attr('id',fileId);
  18. jQuery(oldElement).before(newElement);
  19. jQuery(oldElement).appendTo(form);
  20. }


修改位置大概40行左右

ajaxfileupload修改前后对比


另外,dataType=“json”可能导致不管请求成功或失败都会回调error。因为返回的json字符串被包装为<pre>json</pre>。

解决方法为:

  1. //修改
  2. //eval( "data = " + data );
  3. //修改
  4. data = jQuery.parseJSON(jQuery(data).text());


修改位置大概215行左右

修改版本ajaxfileupload.js下载

猜你在找的Ajax相关文章