ajaxFileUpload的使用和参数说明

最新推荐文章于 2022-11-22 10:45:38 发布

原创最新推荐文章于 2022-11-22 10:45:38 发布 · 6.2k 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#异步上传 #fileupload

JavaScript 同时被 3 个专栏收录

30 篇文章

订阅专栏

asp-net

9 篇文章

订阅专栏

5 篇文章

订阅专栏

本文介绍了ajaxFileUpload插件的使用方法及参数规范，并通过示例展示了如何配置客户端及服务器端来实现文件上传功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

前面有提到使用ajaxFileUpload的例子，这里再来谈一下ajaxFileUpload使用规范

ajaxFileUpload.js下载地址http://download.youkuaiyun.com/download/qq_25956141/10192286

------------------

参数规范：

传递类型为json类型的参数

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

使用实例

	function ajaxFileUpload() {
            $.ajaxFileUpload(
                {
                    url: '/Handler2.ashx?method=ajaxFileUpload', //用于文件上传的服务器端请求地址
                    secureuri: false, //是否需要安全协议，一般设置为false
                    fileElementId: 'file1', //文件上传域的ID
                    dataType: 'json', //返回值类型 一般设置为json
                    success: function (data, status)  //服务器成功响应处理函数
                    {
                        console.log(data.msg);
                        if (typeof (data.error) != 'undefined') {
                            if (data.error != '') {
                                alert(data.error);
                            } else {
                                alert(data.msg);
                            }
                        }
                    },
                    error: function (data, status, e)//服务器响应失败处理函数
                    {
                        alert(e);
                    }
                }
            );
            return false;
        }

在onclick事件中直接调用该函数即可

错误提示:

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直接打印的方法检查各参数是否正确，比起上面这些无效的错误提示还是方便很多。

、

服务端直接接收文件即可，跟fileUpload组件接收的方式是一样的。接收之后，要响应json类型的数据

asp.net中使用实例

    public static void ajaxFileUpload(HttpContext context) {
        HttpFileCollection files = context.Request.Files;
        string msg = string.Empty;
        string error = string.Empty;
        if (files.Count > 0)
        {
            string director = context.Server.MapPath("/") + "fileupload";
            if (!System.IO.Directory.Exists(director))
            {
                System.IO.Directory.CreateDirectory(director);
            }
            string path = director + "/" + System.IO.Path.GetFileName(files[0].FileName);
            if (System.IO.File.Exists(path))
            {
                msg = "上传失败，文件存在";
            }
            else {
                files[0].SaveAs(path);
                //返回json数据
                msg = "上传成功";
            }
            string res = "{ error:'" + error + "', msg:'" + msg + "'}";
            context.Response.Write(res);
            context.Response.End();
        }
    }

一般使用实例

http://blog.youkuaiyun.com/qq_25956141/article/details/78991983