AjaxUploadJavascript 异步上传插件
Javascript 异步上传插件,包含 3 个子项目 BUpload, JUpload, TUpload, 你可以根据项目的需求选择使用:
-
BUpload : 基于HTML5, UI仿百度编辑器的图片上传, 支持图片上传,在线图片管理,和图片搜索和远程图片抓取,支持图片预览,有进度条
-
TUpload : 基于HTML5, UI仿腾讯的QQ空间上传图片,支持图片预览,有进度条。
-
JUpload : 基于HTML5+iframe的异步上传,会自动判断,如果不支持 H5就会使用 iframe 上传
插件依赖:
-
jQuery-1.7.1以上版本
在线预览
http://d.r9it.com/ajaxupload/
使用
BUpload
$("#upload-btn").on("click", function() {
new BUpload({
upload_url : "upload.php",
list_url : "image_list.php", //图片列表数据获取url
search_url : "image_search.php", //图片搜索页面url
max_filesize : 1024,
max_filenum : 10,
callback : function(data) {
$.each(data, function(idx, item) {
$("#image-box").append('');
});
console.log(data);
}
});
});
TUpload
$("#upload-btn").on("click", function() {
new TUpload({
uploadUrl : "upload.php",
maxFileSize : 1024,
maxFileNum : 20,
callback : function(data) {
$.each(data, function(idx, item) {
$("#image-box").append('');
});
console.log(data);
}
});
});
JUpload
$("#upload-btn").JUpload({
url : "upload.php",
src : "src",
image_container : "image-box"
});
$("#upload-btn2").JUpload({
url : "upload.php",
src : "src",
callback : function(data) {
$("#img-src").val(data.message);
}
});评论
