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. caffe配置NCCL

    设置Makefile.config 打开开关: USE_NCCL := 1, 并添加nccl库路径 USE_NCCL := 1 INCLUDE_DIRS += /path/nccl/build/inc ...

  2. BZOJ3771 Triple（FFT+容斥原理）

    思路比较直观.设A(x)=Σxai.先把只选一种的统计进去.然后考虑选两种,这个直接A(x)自己卷起来就好了,要去掉选同一种的情况然后除以2.现在得到了选两种的每种权值的方案数,再把这个卷上A(x). ...

  3. Codeforces Round #440 (Div. 2) A,B,C

    A. Search for Pretty Integers time limit per test 1 second memory limit per test 256 megabytes input ...

  4. Ambiguous handler methods mapped for HTTP

    前端访问的 controller 地址没有加方法名导致找不到. Servlet.service() for servlet [spring] in context with path [/ssmDem ...

  5. 用DotNetOpenAuth实现基于OAuth 2.0的web api授权 （一）Getting Start

    1. 下载 源码下载 2. build solution,创建虚拟目录: 右健MyContatacts/MyPromo项目,选择Properties,点击左边的Web,点击 Create Virtua ...

  6. 【转】#pragma pack(push,1)与#pragma pack(1)的区别

    这是给编译器用的参数设置,有关结构体字节对齐方式设置, #pragma pack是指定数据在内存中的对齐方式. #pragma pack (n)             作用:C编译器将按照n个字节对 ...

  7. 安装Prometheus-Opeartor

    一.下载git clone clone https://github.com/coreos/prometheus-operator.git或:wget https://github.com/coreo ...

  8. django restframework Serializers

    序列化器允许将诸如查询集和模型实例之类的复杂数据转换为原生 Python 数据类型,然后可以将它们轻松地呈现为 JSON,XML 或其他内容类型.序列化器还提供反序列化,在首次验证传入数据之后,可以将 ...

  9. 手动实现property装饰器

    首先,property装饰器是通过数据描述符实现的.用法很简单,大家应该都知道,这里就不细说了. 这里主要分析一下property是如何通过描述符实现的. class Property: def __ ...

  10. 一起使用mock数据动态创建表格

    在ant-design中,我们创建一个基础table会怎么实现呢? 如下代码可视,我们会自己创建一些数据,在表格中渲染出来,如下 <Card title="基础表格"> ...