jquery uploadify怎么取消已上传成功文件-亚博电竞手机版
这篇文章将为大家详细讲解有关jquery uploadify怎么取消已上传成功文件，小编觉得挺实用的，因此分享给大家做个参考，希望大家阅读完这篇文章后可以有所收获。
如何使用uploadify进行文件上传,各位都能够在网上找到,但是需要注意版本号.我这里仅仅说一下,在文件已经成功上传到服务器之后,如何取消文件的上传.
我使用的是自动上传，即将'auto'属性设置为true.
1.首先我们要设置cancelmg属性,即设置文件上传成功后,显示在文件上的关闭图片.这里需要修改对应css中的代码
.uploadify-queue-item.cancela{ background:00no-repeat; float:right; height:16px; text-indent:-9999px; width:16px; }将这里url中的uploadify-cancel.png的地址设置正确.这时可以看到上传的文件后会显示对应的取消关闭图片.当然我们不修改源码,将图片放置在img文件夹下也可以.
2.当我们使用自动上传,点击文件对应上的关闭,这时是不会触发'oncancel'事件的,(oncancel事件是针对不自动上传时进行触发的)所以我们需要需要绑定对应的事件到取消图片上.
3.当每个图片上传成功之后,都会触发”onuploadsuccess”事件.所以我们将绑定操作写在onuploadsuccess函数中.
4.代码如下:
onuploadsuccess:function(file,data,response){ varcancel=$('#filequeue.uploadify-queue-item[id="' file.id '"]').find(".cancela"); if(cancel){ cancel.attr("deletefileid",file.id); cancel.click(function(){ //我的处理逻辑 //1.首先调用ajax传递文件名到后台,后台删除对应的文件(这个我就不写了) //2.从后台返回的为true,表明删除成功;返回false,表明删除失败 vardeletefileid=cancel.attr("deletefileid"); $("#uploadify").uploadify("cancel",deletefileid);//将上传队列中的文件删除. }); } }5.$("#uploadify").uploadify("cancel",deletefileid); 这会调用uploadify中的cancel方法,但是cancel方法中有一个问题,通过查看源码,发现cancel方法并没有将队列中的文件删除,只是在前台删除了对应的div.这样就会导致,假设当我上传文件a,已经上传成功,这时我点击删除图片,取消文件a的上传,这时前台a文件消失,但是假如我再次上传文件a,会提示我已经上传过文件a了,这显然是有问题的.其实,uploadify的cancel方法就是针对还没有上传到服务器的文件,这时点击取消,调用cancel方法,即cancel方法针对的是还没有上传到服务器的文件.
这时我们需要修改源码将对应需要删除的文件在队列中进行删除.
cancel:function(fileid,supressevent){ varargs=arguments; this.each(function(){ //createareferencetothejquerydomobject var$this=$(this), swfuploadify=$this.data('uploadify'), settings=swfuploadify.settings, delay=-1; if(args[0]){ //clearthequeue if(args[0]=='*'){ varqueueitemcount=swfuploadify.queuedata.queuelength; $('#' settings.queueid).find('.uploadify-queue-item').each(function(){ delay ; if(args[1]===true){ swfuploadify.cancelupload($(this).attr('id'),false); }else{ swfuploadify.cancelupload($(this).attr('id')); } $(this).find('.data').removeclass('data').html('-cancelled'); $(this).find('.uploadify-progress-bar').remove(); $(this).delay(1000 100*delay).fadeout(500,function(){ $(this).remove(); }); }); swfuploadify.queuedata.queuesize=0; swfuploadify.queuedata.queuelength=0; //triggertheonclearqueueevent if(settings.onclearqueue)settings.onclearqueue.call($this,queueitemcount); }else{ for(varn=0;n关于“jquery uploadify怎么取消已上传成功文件”这篇文章就分享到这里了，希望以上内容可以对大家有一定的帮助，使各位可以学到更多知识，如果觉得文章不错，请把它分享出去让更多的人看到。
展开全文