原文：http://www.cnblogs.com/kissdodog/archive/2012/12/15/2819025.html

ajaxFileUpload是一个异步上传文件的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插件。注意先后顺序，这个不用说了，所有的插件都是这样。

    <script src="jquery-1.7.1.js" type="text/javascript"></script>

    <script src="ajaxfileupload.js" type="text/javascript"></script>

　　第二步：HTML代码：

<body>

    <p><input type="file" id="file1" name="file" /></p>

    <input type="button" value="上传" />

    <p><img id="img1" alt="上传成功啦" src="" /></p>

</body>

　　第三步：JS代码

    <script src="jquery-1.7.1.js" type="text/javascript"></script>

    <script src="ajaxfileupload.js" type="text/javascript"></script>

    <script type="text/javascript">

        $(function () {

            $(":button").click(function () {

                ajaxFileUpload();

            })

        })

        function ajaxFileUpload() {

            $.ajaxFileUpload

            (

                {

                    url: '/upload.aspx', //用于文件上传的服务器端请求地址

                    secureuri: false, //是否需要安全协议，一般设置为false

                    fileElementId: 'file1', //文件上传域的ID

                    dataType: 'json', //返回值类型 一般设置为json

                    success: function (data, status)  //服务器成功响应处理函数

                    {

                        $("#img1").attr("src", data.imgurl);

                        if (typeof (data.error) != 'undefined') {

                            if (data.error != '') {

                                alert(data.error);

                            } else {

                                alert(data.msg);

                            }

                        }

                    },

                    error: function (data, status, e)//服务器响应失败处理函数

                    {

                        alert(e);

                    }

                }

            )

            return false;

        }

    </script>

jQuery插件之ajaxFileUpload的更多相关文章

  1. jQuery插件之ajaxFileUpload异步上传

    介绍 AjaxFileUpload.js 是一个异步上传文件的jQuery插件,原理是创建隐藏的表单和iframe然后用JS去提交,获得返回值. 下载地址: http://files.cnblogs. ...

  2. 异步上传文件,ajax上传文件,jQuery插件之ajaxFileUpload

    http://www.cnblogs.com/kissdodog/archive/2012/12/15/2819025.html 一.ajaxFileUpload是一个异步上传文件的jQuery插件. ...

  3. jQuery插件之ajaxFileUpload 2

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

  4. ASP.NET- 无刷新上传使用jQuery插件之ajaxFileUpload

    灰常好,我已经使用过里面的代码了,可以用,原文地址:http://www.cnblogs.com/kissdodog/archive/2012/12/15/2819025.html 一.ajaxFil ...

  5. jQuery插件之ajaxFileUpload[转载]

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

  6. 【转】jQuery插件之ajaxFileUpload

    转自:http://www.cnblogs.com/kissdodog/archive/2012/12/15/2819025.html 说在前头,本文出自上面的作者,只是以前存的一些网址不见了,怕以后 ...

  7. jQuery插件之ajaxFileUpload API文档

    ajaxFileUpload是一个异步上传文件的jQuery插件. 语法:$.ajaxFileUpload([options]) options参数说明: 1.url  上传处理程序地址. 2,fil ...

  8. jQuery插件之ajaxFileUpload（ajax文件上传）

    一.ajaxFileUpload是一个异步上传文件的jQuery插件. 传一个不知道什么版本的上来,以后不用到处找了. 语法:$.ajaxFileUpload([options]) options参数 ...

  9. [Pulgin] jQuery插件之ajaxFileUpload

    一.ajaxFileUpload是一个异步上传文件的jQuery插件. 传一个不知道什么版本的上来,以后不用到处找了. 语法:$.ajaxFileUpload([options]) options参数 ...

随机推荐

  1. monodevelop 突然莫名其妙的将 warning 全部标记为 error

    这是一个关于 monodevelop 的“坑” 我们在用 monodevelop 编译游戏脚本时, 通常会有一些警告,一般这些警告都是无害的, 不影响游戏运行.可是突然有一天, monodevelop ...

  2. Linux系统安装VMware tools

    VMware tools还是挺有用的,在两个不同系统随意拖拽文件,甚至文字的复制粘贴,功能强大. 废话不多说... 虽然VMware tools的安装帮助文档写的不错但是实际操作中发现,...还是有坑 ...

  3. Yii2 性能优化 来源yii2官方文档

    优化你的 PHP 环境 使用最新稳定版本的 PHP . PHP 的主要版本可能带来显著的性能提升. 启用字节码缓存 Opcache(PHP 5.5或更高版本) 或 APC (PHP 5.4或更早版本) ...

  4. 利用html5 canvas实现纯前端上传图片的裁剪

    今天跟大家分享一个前端裁剪图片的方法.许多网站都有设置用户头像的功能,用户可以选择一张本地的图片,然后用网站的裁剪工具进行裁剪,然后设置大小,位置合适的头像.当然,网上也有一些用js写的诸如此类裁剪的 ...

  5. Linux环境变量配置

    /etc/profile:此文件为系统的每个用户设置环境信息,当用户第一次登录时,该文件被执行.并从/etc/profile.d目录的配置文件中搜集shell的设置./etc/bashrc:为每一个运 ...

  6. libj 0.8.2 发布，Java/JavaScript API 的 C++ 实现

    libj 0.8.2 增加了一些新的字符串相关的方法. libj 是一个跨平台的运行库,相当于提供了类似 Java/JavaScript API.libj 的内存管理是自动的,基于 shared_pt ...

  7. WPF快速入门系列(7)——深入解析WPF模板

    一.引言 模板从字面意思理解是“具有一定规格的样板".在现实生活中,砖块都是方方正正的,那是因为制作砖块的模板是方方正正的,如果我们使模板为圆形的话,则制作出来的砖块就是圆形的,此时我们并不 ...

  8. 可在广域网部署运行的QQ高仿版 -- GG叽叽V1.8（源码）

    距离的GG 1.0发布已经三周了,这三周内,我利用业余时间为GG增加了视频聊天的功能.个人觉得进展有些缓慢,主要是因为大多数时间都花在了UI上.由于本人不会PS,所以图片素材都是从网上一个一个搜下来的 ...

  9. MySQL7：视图

    什么是视图 数据库中的视图是一个虚拟表.视图是从一个或者多个表中导出的表,视图的行为与表非常相似,在视图中用户可以使用SELECT语句查询数据,以及使用INSERT.UPDATE和DELETE修改记录 ...

  10. Java对象表示方式1：序列化、反序列化和transient关键字的作用

    平时我们在Java内存中的对象,是无法进行IO操作或者网络通信的,因为在进行IO操作或者网络通信的时候,人家根本不知道内存中的对象是个什么东西,因此必须将对象以某种方式表示出来,即存储对象中的状态.一 ...