摸清脉络 Plupload如何删除一条数据 2014-10-12 13:46:50
( 11人已投票,[高质量] )
Plupload是一款挺不错的插件,加上jQuery的方式,让上传图片文件更加方便,界面友好,用户体验也更上一层楼,但使用过程中难免会出现一点“情况”,比如,如何删掉一条需要上传的图片?也许你会发出用了FilesRemoved并不成功,删除图片这么重要怎可如此!
无意中从老外提的一个问题发现这个问题解决办法,特此备注以供不会的童鞋参考:
uploader.bind('FilesAdded', function(up, files) { for (var i in files) { console.log("###"+i); $('file_list').innerHTML += '<div class="pic_list" id="' + files[i].id + '">' + files[i].name + ' (' + plupload.formatSize(files[i].size) + ') <b class="pic_delete" data-val='+files[i].id+'>删除</b><b> <input type=text class="lable_describe pic_' + files[i].id +'" placeholder="图片描述..."> </b></div>'; } });
这是图片添加时会自动调用的部分
在这里我用到了一个删除菜单,把files[i].id赋给它
然后用jQuery来处理,注意,jQuery和这个插件会冲突的,做好处理,我这里就不详述了
处理的jQuery代码如下:
$(document).on('click','.pic_list b.pic_delete',function(){ $(this).parent().remove(); //uploader.removeFile($(this).attr("data-val")); var toremove = ''; var id=$(this).attr("data-val"); for(var i in uploader.files){ if(uploader.files[i].id === id){ toremove = i; } } uploader.files.splice(toremove, 1); console.log("XXX"+$(this).attr("data-val")); });
removeFile那样调用不成功,原因暂未知晓。
不过这样就可以删除掉不用上传的图片了
另外,再次细心的人会注意到,添加的图片的时候,file[i]这个i会从0开始。
应该是多维数组了,以上代码经多次测试,屡试不爽
版权声明:
作者信息(Author) :雪炭网 : 花花世界
原文链接(Hyperlink):https://snowcoal.com/article/423.html
原创内容,尊重版权,转载需注明出处;商业及其他特殊用途转载需原作者同意。
原文链接(Hyperlink):https://snowcoal.com/article/423.html
原创内容,尊重版权,转载需注明出处;商业及其他特殊用途转载需原作者同意。