ajaxupload 使用例子

前端之家收集整理的这篇文章主要介绍了ajaxupload 使用例子前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

ajaxuplaod下载地址:

http://pan.baidu.com/share/link?shareid=297437689&uk=739224795

文章例子压缩包:

http://pan.baidu.com/share/link?shareid=299848842&uk=739224795


示例代码

@H_@R_301_448@_13@<html> <head> <title>ajaxupload上传</title> <Meta charset="utf-8"/> <style type="text/css"> .divMain{ position:absolute; width:140px; height:100px; padding-left:60px; padding-top:40px; } #upload{ width:150px; height:30px; } .content{ width:300px; height:200px; } </style> <script type="text/javascript" src="./jquery.1.8.js"></script> <script type="text/javascript" src="./ajaxupload.js"></script> </head> <body> <div class="divMain"> <button id="upload">文件上传</button> <div class="content"></div> </div> </body> <script type="text/javascript"> /* ajaxupload上传 */ $(document).ready(function(){ var button = $('#upload'),interval; var fileType = "all",fileNum = "one"; new AjaxUpload(button,{ action: './upload.PHP',name: 'userfile',onSubmit : function(file,ext){ if(fileType == "pic") { if (ext && /^(jpg|png|jpeg|gif)$/.test(ext)){ this.setData({ 'info': '文件类型为图片' }); } else { $('<li></li>').appendTo('.files').text('非图片类型文件,请重传'); return false; } } button.text('文件上传中'); if(fileNum == 'one') this.disable(); interval = window.setInterval(function(){ var text = button.text(); if (text.length < 14){ button.text(text + '.'); } else { button.text('文件上传中'); } },200); },onComplete: function(file,response){//上传成功的函数;response代表服务器返回的数据 //清楚按钮的状态 button.text('文件上传'); window.clearInterval(interval); this.enable(); //修改下方div的显示文字 if('success'==response){ $(".content").text("上传成功"); }else{ $(".content").text("上传失败"); } } }); }); </script> </html>

猜你在找的Ajax相关文章