ajax上传文件的一个简单的jQuery插件ajaxfileupload.js例

jQuery插件ajaxfileupload可以实现文件上传组件。插件非常简单。首先,了解ajaxfileupload插件使用正确的方法,然后学习一些常见错误信息和解决方案。

指令

你需要使用jQuery库文件和ajaxfileupload库文件

用一个例子

1。包含文件的一部分

复制代码代码如下所示:







二、HTML部分

复制代码代码如下所示:





上传



只需要三个元素,一个动态加载小图标,一个文件字段和一个按钮。

注:本ajaxfileupload插件上传文件的使用不需要的形式,如下:



……相关的HTML代码…



因为ajaxfileupload插件自动生成一个表单的提交形式。

对于文件的域ID和名称,ajaxfileupload插件fileelementid参数需要获取文件的域ID。如果你处理上传文件的操作,你需要知道文件的域名得到上传文件的信息,关系必须是明确的。

三,javascript部分



功能ajaxfileupload(){
(加载);动态小图标
ajaxfileupload({美元。
网址:'upload PHP的,
Secureuri:假,
fileelementid:'filetoupload,
DataType:'json,
成功:函数(数据,状态){
如果(typeof(数据错误)!= 'undefined){
如果(data.error!=){
警报(数据错误);
其他{ }
警报(数据,MSG);
}
}
},
错误:函数(数据,状态,E){
警报(e);
}
})
返回false;
}
函数加载(){
$(#加载)。AjaxStart(function(){)
美元(这个);
})。AjaxComplete(function(){)
美元(这个);
});
}



主要参数如下:

1、URL处理文件上传的文件的路径,可以测试是否URL可以访问浏览器直接,如上:upload.php

2、fileelementid代表文件的域ID,如下:filetoupload

3、如果secureuri是安全文件启用,默认为false

4,数据类型,一般选择JSON,Javascript的原生态

5,成功提交一个成功的后处理功能。

6,错误提交失败处理函数

有两种方法,动态加载功能(负载)的小图标提示和ajaxfileupload(美元。ajaxfileupload)文件上传的功能,我们使用jquery.ajax()函数差不多,使用很简单,这里我省略了PHP上传文件,使用jQuery插件ajax文件那么简单ajaxfileupload。

同时,我们需要知道错误的暗示。

1、查询语句错误前失踪;

如果出现此错误,则必须检查URL路径是否可以访问。

2、查询语法错误

如果出现此错误,则必须检查PHP文件中是否有处理提交操作的语法错误。

3、查询:无效的属性ID错误

如果出现此错误,则需要检查属性ID是否存在。

4、查询XML表达错误遗漏}

如果出现此错误,则必须检查文件的域名是否一致或不存在。

5、其他自定义错误

您可以使用直接打印变量$错误的方法检查参数是否正确,这比上面的无效提示方便得多。

它是使用jQuery插件ajaxfileupload以无刷新上传文件,非常实用。由于它的简单性和易用性,与其他文件相比,插件是最广泛使用的插件,因此值得推荐。



处理页面:


使用系统;
使用系统集合;
使用系统配置;
使用系统数据;
使用系统;
使用system.web.security;
使用system.web.ui;
使用system.web.ui.htmlcontrols;
使用system.web.ui.webcontrols;
使用system.web.ui.webcontrols.webparts;

公共部分类web_ajax_fileupload:system.web.ui.page
{
protected void page_load(object sender,EventArgs e)
{
httpfilecollection文件= httpcontext.current.request.files;


/ /如果(文件{ 0 }。contentlength > 5)

写;
响应。写入()++文件{ 0 }。文件名;
/ /响应。写(错误:文件上传失败);
响应写入(});
/