当前路径: 星河码客 » 插件特效 » jQuery件可拖拽和带预览图文件上传插_ajax无刷新上传工具 ssi-uploader

jQuery件可拖拽和带预览图文件上传插_ajax无刷新上传工具 ssi-uploader

ssi-uploader是一款带预览图并且可以拖拽文件的jQuery ajax文件上传插件。该文件上传插件支持AJAX,支持多文件上传,可控制上的文件格式和文件大小,提供各种回调函数,使用非常方便。使用方法在页面中引入ssi-uploader.css和ssi-uploader.js文件 HTML结构最基本的文件上传HTML结构是使用一个元素,类型为file,并指定一个id。在页面DOM元素加载完毕之后,可以通过ssi_uploader方法来初始化该文件上传插件。$('#ssi-upload').ssi_uploader({ url: 'path/to/upload.php'}); 例子$('#ss-uploader').ssi_uploader({ responseValidation:{ validationKey: 'type', resultKey: 'data', success: 'success', error: 'error' }});$('#ss-uploader').ssi_uploader({ responseValidation:{ validationKey: { success: 'success', error: 'error' }, resultKey: 'validationKey' }})回调函数beforeUpload回调函数在文件上传前执行。$('input').ssi_uploader({url:'uploadAction.php',beforeUpload:function(){ console.log('文件上传准备就绪!');}}) $('input').on('beforeUpload.ssi-uploader',function(){console.log('一个文件准备上传。')}); beforeEachUpload回调函数在每一个单独的文件上传前执行。该函数访问每个文件的信息和xhr对象。如果终止了某个文件,你可以设置一个字符串,提示取消的原因,并显示的错误信息中。$('input').ssi_uploader({url:'uploadAction.php',beforeEachUpload:function(fileInfo,xhr){ console.log(fileInfo.name+' '+fileInfo.type+' '+fileInfo.size); if(fileInfo.size > 1){ xhr.abort(); } return '文件尺寸太大!';}}); $('input').on('beforeEachUpload.ssi-uploader',function(){console.log('A file is going for uploading.')});onUpload回调函数在文件上传后执行$('input').ssi_uploader({url:'uploadAction.php',onUpload:function(){ console.log('文件上传完毕!');}}) $('input').on('onUpload.ssi-uploader',function(){console.log('文件上传完毕!')});onEachUpload回调函数在每一个单独的文件上传后执行$('input').ssi_uploader({url:'uploadAction.php',onEachUpload:function(fileInfo){ console.log(fileInfo.uploadStatus+' 'fileInfo.name+' '+fileInfo.type+' '+fileInfo.size+' '+fileInfo.uploadStatus);}}); $('input').on('onEachUpload.ssi-uploader',function(){console.log('A file uploaded.')})

jQuery件可拖拽和带预览图文件上传插_ajax无刷新上传工具 ssi-uploader

在线演示        积分下载        6毛下载        砍两刀下载       

文件目录······
暂无数据
 猜你喜欢 更多»
 工具推荐 更多»