jquery uploadify怎么取消已上传成功文件

　　介绍

这篇文章将为大家详细讲解有关jquery uploadify怎么取消已上传成功文件,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。

如何使用uploadify进行文件上传,各位都能够在网上找的到,但是需要注意版本号。我这里仅仅说一下,在文件已经成功上传到服务器之后,如何取消文件的上传。

我使用的是自动上传,即将& # 39;汽车# 39;属性设置为真实的。

1。首先我们要设置cancelmg属性,即设置文件上传成功后,显示在文件上的关闭图片。这里需要修改对CSS中应的代码

.uploadify-queue-item  .cancel  a  {, 　　,,背景:url (. ./img/uploadify-cancel.png& & # 39; # 39;), 0, 0,没有重演,, 　　浮:,才能正确的,, 　　,,身高:16 px;, 　　,,indent: -9999 px,, 　　,,宽度:16 px;, 　　}

将这里url中的uploadify-cancel.png的地址设置正确。这时可以看到上传的文件后会显示对应的取消关闭图片。当然我们不修改源码,将图片放置在img文件夹下也可以。

2。当我们使用自动上,传点击文件对应上的关闭,这时是不会触发& # 39;虚# 39;事件的,(虚事件是针对不自动上传时进行触发的),所以我们需要需要绑定对应的事件到取消图片上。

3。当每个图片上传成功之后,都会触发“onUploadSuccess”事件,所以我们将绑定操作写在onUploadSuccess函数中。

4。代码如下:

onUploadSuccess:函数(文件,数据,响应),{, 　　,,,var 取消=$ (& # 39;# fileQueue  .uploadify-queue-item [id=? # 39;, +, file.Id  +, & # 39;“] & # 39;); (“.cancel  a");, 　　if (取消),{, 　　cancel.attr才能(“deletefileid" file.id),, 　　cancel.click才能(function  (), {, 　　,,,//我的处理逻辑, 　　,,,//1。首先调用ajax 传递文件名到后台,后台删除对应的文件(这个我就不写了), 　　,,,//2。从后台返回的为真,表明删除成功,返回假,表明删除失败, 　　,,,,var  deletefileid =, cancel.attr (“deletefileid");, 　　,,,,(“# uploadify") .uploadify美元(“cancel" deletefileid);//将上传队列中的文件删除又是; 　　,,}); 　　}, 　　}

5。(“# uploadify") .uploadify美元(“cancel" deletefileid);这会调用uploadify中取消的方法,但是取消方法中有一个问题,通过查看源码,发现取消方法并没有将队列中的文件删除,只是在前台删除了对应的div。这样就会导致,假设当我上传文件,已经上传成功,这时我点击删除图片,取消文件一个的上传,这时前台一个文件消失,但是假如我再次上传文件,会提示我已经上传过文件了,这显然是有问题的。
其实,uploadify的取消方法就是针对还没有上传到服务器的文件,这时点击取消,调用取消方法,即取消方法针对的是还没有上传到服务器的文件。

这时我们需要修改源码将对应需要删除的文件在队列中进行删除。

 cancel :,函数(文件标识,supressEvent), {,
　　,
　　var 才能;args =,参数,,
　　,
　　this.each才能(函数(),{,
　　,,,//,Create  a 参考文档用,jQuery  DOM  object 
　　,,,var 美元却;能够,,,=,(这),美元,
　　,,,,,swfuploadify =, this.data美元(& # 39;uploadify& # 39;),,
　　,,,,,settings ,,=, swfuploadify.settings,,
　　,,,,,delay ,,,=, 1,,
　　,
　　,,,if  (args [0]), {,
　　,,,,,//,Clear 从而queue 
　　,,,,,if  (args [0],==, & # 39; * & # 39;), {,
　　,,,,,,,var  queueItemCount =, swfuploadify.queueData.queueLength;,
　　,,,,,,,美元(& # 39;# & # 39;,+,settings.queueID); (& # 39; .uploadify-queue-item& # 39;) . each(函数(),{,
　　,,,,,,,,,延迟+ +,,
　　,,,,,,,,,if  (args[1],===,真的),{,
　　,,,,,,,,,,,swfuploadify.cancelUpload(美元(这).attr (& # 39; id # 39;),,假),,
　　,,,,,,,,,},{,else 
　　,,,,,,,,,,,swfuploadify.cancelUpload($(这).attr (& # 39; id # 39;)),,
　　,,,,,,,,,},
　　,,,,,,,,,(这);美元(& # 39;. data # 39;) .removeClass(& # 39;数据# 39;). html(& # 39;,安康;取消# 39;),,
　　,,,,,,,,,(这);美元(& # 39;.uploadify-progress-bar& # 39;) .remove (),,
　　,,,,,,,,,(这).delay美元(100,1000,+,*,延迟).fadeOut(500年,()函数,{,
　　,,,,,,,,,,,(这)美元.remove (),,
　　,,,,,,,,,}),,
　　,,,,,,,}),,
　　,,,,,,,,,=,swfuploadify.queueData.queueSize  0;,
　　,,,,,,,swfuploadify.queueData.queueLength =, 0;,
　　null
　　null
　　null
　　null
　　null
　　null
　　null
　　null
　　null
　　null
　　null
　　null
　　null
　　null
　　null
　　null
　　null
　　null
　　null
　　null
　　null
　　null
　　null
　　null
　　null
　　null
　　null
　　null
　　null
jquery uploadify怎么取消已上传成功文件