博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
jQuery插件之ajaxFileUpload
阅读量:7037 次
发布时间:2019-06-28

本文共 1613 字,大约阅读时间需要 5 分钟。

ajaxFileUpload.js 很多同名的,因为做出来一个很容易。

我用的是这个:https://github.com/carlcarl/AjaxFileUpload 

下载地址在这里:http://files.cnblogs.com/files/kissdodog/ajaxfileupload_JS_File.rar

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

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

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

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

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

  语法:$.ajaxFileUpload([options])

  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

错误提示:

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插件。注意先后顺序,这个不用说了,所有的插件都是这样。

    

第二步:HTML代码:

    

上传成功啦

第三步:JS代码

        

今天调试过程中发现一个问题,就是作为文件域(<input type="file">)必须要有name属性,如果没有name属性,上传之后服务器是获取不到图片的。如:正确的写法是<input type="file" id="file1" name="file1" />

 最经典的错误终于找到原因所在了。Object function (a,b){return new e.fn.init(a,b,h)} has no method 'handleError',这个是google浏览器报的错误,非常经典, 不知道是我的版本问题还是真正存在的问题。这个问题的根源经过N次上传才找到问题的根本所在。答案是:dataType参数一定要大写。如:dataType: 'HTML'。

转载地址:http://mvnal.baihongyu.com/

你可能感兴趣的文章
VC皮肤库SkinSharp 1.0.6.6的使用
查看>>
php上传图片到server
查看>>
如何对 GIT 分支进行规划?
查看>>
说说非托管资源的回收
查看>>
虚拟机安装麒麟3.2时报unkown filesystem,you need to load the linux kernel first
查看>>
Node.js模块封装及使用
查看>>
java selenium (十) 操作浏览器
查看>>
检测光纤的同心性
查看>>
Vim快捷键分类
查看>>
【BOOM】一款有趣的Javascript动画效果
查看>>
关于java mail 发邮件的问题总结(转)
查看>>
Visual Prolog 的 Web 专家系统 (9)
查看>>
python匹配ip正则
查看>>
Win2003x64系统
查看>>
设计模式 : Template method 模板方法模式 -- 行为型
查看>>
第二十九节,装饰器
查看>>
[LintCode] Valid Palindrome 验证回文字符串
查看>>
jQuery的基本语法
查看>>
javascript 数组实例
查看>>
iOS开发UI篇—CAlayer(创建图层)
查看>>