ajaxFileUpload是一个异步上传文件的jQuery插件
语法:$.ajaxFileUpload([options])

options参数说明:

参数 作用
url 上传处理程序地址
fileElementId 需要上传的文件域的ID,即<input type="file">的ID
secureuri 是否启用安全提交,默认为false
dataType 服务器返回的数据类型。可以为xml,script,json,html。如果不填写,jQuery会自动判断
success 提交成功后自动执行的处理函数,参数data就是服务器返回的数据
error 提交失败自动执行的处理函数
data 自定义参数
type 当要提交自定义参数时,这个参数要设置成post

错误提示

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

代码示例

<!DOCTYPE html>
<html>
<head>
    <title>ajaxUpLoad.js Demo</title>
    <script src="jquery-1.7.1.js" type="text/javascript"></script>
    <script src="ajaxfileupload.js" type="text/javascript"></script>
</head>
<body>
<body>
    <input type="file" id="tempFile" name="file" />
    <input type="button" value="上传" id="uploadBtn" />

    <script type="text/javascript">
        $(function(){
            $("#tempFile").click(function(){
                $.ajaxFileUpload({
                    url: "/file/upload",
                    type: 'post',
                    secureuri: false,
                    fileElementId: 'tempFile',
                    dataType: 'json',
                    success: function(data){

                    },
                    error: function(){
                        alert("error");
                    }
                });
            });
        });
    </script>
</body>
</body>
</html>

jQuery - ajaxUpLoad.js的更多相关文章

  1. AjaxUpLoad.js使用实现文件上传

    AjaxUpLoad.js的使用实现无刷新文件上传,如图. 图1 文件上传前 图2 文件上传后 1.创建页面并编写HTML [html] view plaincopy   上传文档: <div  ...

  2. 上传系列:jquery.upload.js

    最近想做一个上传的总结,把自己用过的上传插件都写一写,哪天用到的时候就不用再一次的翻阅资料,现在页面上用到的上传插件,原理上都差不多,那我也就不再废话了,下面我主要记录一下几个比较常用的,由简到繁,这 ...

  3. 上传系列:ajaxupload.js

    ajaxupload.js 上次说了jquery.upload.js,这次再说一下ajaxupload.js,这个其实也比较简答,只有一个JS文件: html代码: $(function () { v ...

  4. jquery和Js的区别和基础操作

    jqery的语法和js的语法一样,算是把js升级了一下,这两种语法可以一起使用,只不过是用jqery更加方便 一个页面想要使用jqery的话,先要引入一下jqery包,jqery包从网上下一个就可以, ...

  5. jQuery.template.js 简单使用

    之前看了一篇文章<我们为什么要尝试前后端分离>,深有同感,并有了下面的评论: 我最近也和前端同事在讨论这个问题,比如有时候前端写好页面给后端了,然后后端把这些页面拆分成很多的 views, ...

  6. 修改 jquery.validate.js 支持非form标签

    尝试使用markdown来写一篇blog,啦啦啦 源代码传送门:github 在特殊情况下我们使用jquery.validate.js对用户输入的内容做验证的时候,表单并不是一定包含在form之中,有 ...

  7. 表单验证插件之jquery.validate.js

    提到表单验证的插件,第一个想到的就是jquery.validate.js,所以小生想在这里稍微详细地说一下这款插件的具体使用方法,便于理解,我直接附上整段demo的代码(没怎么调样式,主要是看js): ...

  8. 延迟加载外部js文件,延迟加载图片(jquery.lazyload.js和echo,js)

    js里一说到延迟加载,大都离不开两种情形,即外部Js文件的延迟加载,以及网页图片的延迟加载: 1.首先简单说一下js文件的3种延迟加载方式: (1)<script type="text ...

  9. 初探jquery.slimscroll.js和iscroll5.js

    网上关于实现各种滚动效果的插件不胜枚举,这里,我简单介绍一下自己用过的两款比较有代表性的插件: 1.jquery.slimscroll.js,需要先引入jquery类库,主要用于模拟传统的浏览器滚动条 ...

随机推荐

  1. IPv6应用普及,任重而道远

    导读 2018年初开始,全国尤其是运营商网络开启了IPv6改造的大幕,很多企业都从工信部领到了军令状,要将IPv6改造工作彻底落实下去.现在2018年已接近尾声,回头看看实际部署情况如何. IPv6涉 ...

  2. android studio marvin 配置

    buildscript { repositories { maven{ url 'http://maven.aliyun.com/nexus/content/groups/public/'} } } ...

  3. BZOJ2212 POI2011Tree Rotations(线段树合并)

    显然子树内的操作不会对子树外产生影响.于是贪心,若交换之后子树内逆序对减少就交换. 这个东西可以用权值线段树计算.操作完毕后需要对两棵权值线段树合并,这个的复杂度是两棵线段树的重复节点个数.那么总复杂 ...

  4. Spring的 AOP底层用到两种代理机制

    JDK 的动态代理:针对实现了接口的类产生代理.CGlib 的动态代理:针对没有实现接口的类产生代理,应用的是底层的字节码增强的技术 生成当前类的子类对象 JDK动态代理实现1. 创建接口和对应实现类 ...

  5. Dumb Bones UVA - 10529(概率dp)

    题意: 你试图把一些多米诺骨牌排成直线,然后推倒它们.但是如果你在放骨牌的时候不小心把刚放的骨牌碰倒了,它就会把相临的一串骨牌全都碰倒, 而你的工作也被部分的破坏了. 比如你已经把骨牌摆成了DD__D ...

  6. java 字符串的运算公式直接转计算结果

    // 字符串的运算公式直接转计算结果 public static void main(String[] args) {ScriptEngine se = new ScriptEngineManager ...

  7. BZOJ 4032: [HEOI2015]最短不公共子串

    4032: [HEOI2015]最短不公共子串 Time Limit: 10 Sec  Memory Limit: 256 MBSubmit: 446  Solved: 224[Submit][Sta ...

  8. BZOJ 1778: [Usaco2010 Hol]Dotp 驱逐猪猡

    1778: [Usaco2010 Hol]Dotp 驱逐猪猡 Time Limit: 10 Sec  Memory Limit: 64 MBSubmit: 563  Solved: 216[Submi ...

  9. 做一个懒COCOS2D-X程序猿(一)停止手打所有cpp文件到android.mk

    前言:”懒”在这里当然不是贬义词,而是追求高效,拒绝重复劳动的代名词!做一个懒COCOS2D-X程序猿的系列文章将教会大家在工作中如何偷懒,文章篇幅大多较短,有的甚至只是几行代码,争取把懒发挥到极致! ...

  10. A1029. Median

    Given an increasing sequence S of N integers, the median is the number at the middle position. For e ...