首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

改装Juploader下传组件,使其可以控制自由下传

2012-10-17 
改装Juploader上传组件,使其可以控制自由上传用过Juploader上传组件的人应该对其不陌生,详细了解请访问 ht

改装Juploader上传组件,使其可以控制自由上传

用过Juploader上传组件的人应该对其不陌生,详细了解请访问 http://www.kudystudio.com/jUploader/index.html,这个的无刷新上传还是比较好用的,但它有一个缺陷,就是上传只显示一个按钮,选择完文件后立即上传,不能将上传的工作绑定到一个元素上,进行灵活的控制,比如要实现这样的功能:

改装Juploader下传组件,使其可以控制自由下传

点击上传按钮,弹出文件浏览器选取文件,选择好后将文件路径显示在文本框中,点击“导入”按钮进行上传操作。
ok,无刷新上传Juploader可以实现,但是其他的功能怎么办?

不用着急,我们把该组件改一下,使其即可以保持原来的功能,还可以实现你要的功能,并可对其扩展,看源码:

$.jUploader({button: 'upload_btn', // 这里设置按钮idaction: '<?php echo site_url('role_setup/answer_import/' . $event_id);?>', // 这里设置上传处理接口,这个加了参数test_cancel=1来测试取消eventType:2,//触发类型addeventbutton:'import_begin',// 要绑定事件的元素的idfilenamed:'filename',//存放选择的文件路径的文本框的idonComplete: function (fileName, response) {// response是json对象,格式可以按自己的意愿来定义,例子为: { success: true, fileUrl:'' }if (response.success) {} else {}}  });

在传给Juploader方法的参数中,我们增加了eventType,addeventbutton,用于存放路径的元素的id  filenamed

大功告成!

热点排行