jQuery 插件AjaxFileUpload 实现ajax文件上传

最新推荐文章于 2021-08-06 21:23:36 发布

原创最新推荐文章于 2021-08-06 21:23:36 发布 · 498 阅读

0 ·

CC 4.0 BY-SA版权

js 专栏收录该内容

36 篇文章

订阅专栏

添加

ajaxfileupload.js

    <script type="text/javascript" src="../res/ajaxFileupload/jquery-1.7.2.min.js"></script>
    <script type="text/javascript" src="../res/ajaxFileupload/ajaxfileupload.js"></script>

function ajaxFileUploadFn(){
 	var data = {name:'my_name',description:'short_description','sizeMark':1};
	    $.ajaxFileUpload({
	        url: '../fileUpload.do',
	        secureuri: false,
	        data: data,
	        fileElementId: 'pic1_url',
	        dataType: 'json',
	        success: function (data) {
	            if(data.state == 0){
	                 //上传成功
	            }else{
	            	 alert(data.message);
	            }
	        },
	        error: function (data) {
	            alert("error");
	        }
	    });
 }

主要参数说明： 1，url表示处理文件上传操作的文件路径，可以测试URL是否能在浏览器中直接访问，如上：upload.php 2，fileElementId表示文件域ID，如上：fileToUpload 3，secureuri是否启用安全提交，默认为false 4，dataType数据数据，一般选json，javascript的原生态 5，success提交成功后处理函数 6，error提交失败处理函数

需要了解相关的错误提示

1，SyntaxError: missing ; before statement错误如果出现这个错误就需要检查url路径是否可以访问

2，SyntaxError: syntax error错误如果出现这个错误就需要检查处理提交操作的PHP文件是否存在语法错误

3，SyntaxError: invalid property id错误如果出现这个错误就需要检查属性ID是否存在

4，SyntaxError: missing } in XML expression错误如果出现这个错误就需要检查文件域名称是否一致或不存在

ajaxfileupload.js下载：http://download.youkuaiyun.com/download/ying890/8969355

资源来源：http://www.phpddt.com/dhtml/ajaxfileupload.html