jquery uplloadifyはどうやってキャンセルしましたか?アップロードされました。
4786 ワード
どのようにuploadifyを使ってファイルをアップロードしますか?皆さんはネットで見つけられますが、バージョン番号に注意しなければなりません。ここでは、ファイルがサーバーにアップロードされた後、どうやってファイルのアップロードをキャンセルしますか?
私が使っているのは自動アップロードです。もうすぐ「aut」属性はtrueに設定されます。
1.まずcancel mg属性を設定します。つまりファイルのアップロードが成功した後、ファイルに表示されているクローズ画像です。ここでは対応CSSのコードを修正する必要があります。
2.自動アップロードを使って、ファイルの対応上のクローズをクリックすると、「オンザリング」イベントが発生しないので、対応するイベントをキャンセル画面に結びつける必要があります。
3.各画像のアップロードが成功すると、「onUploadSuccess」イベントが発生します。だから、私達はバインディング操作をonUploadSuccess関数に書いています。
4.コードは以下の通りです
実際には、uplloadifyのcancel方法は、まだサーバにアップロードされていないファイルに対して、キャンセルをクリックしてキャンセルします。キャンセル方法、つまり、キャンセル方法はまだサーバにアップロードされていないファイルに対してです。
この時、ソースの変更が必要です。削除すべきファイルをキューから削除します。
以上はアップロードされたファイルをどのようにキャンセルするかについての方法です。もちろん自動アップロードではないなら、アップロードを変更しなくても、直接削除すればいいです。
私が使っているのは自動アップロードです。もうすぐ「aut」属性はtrueに設定されます。
1.まずcancel mg属性を設定します。つまりファイルのアップロードが成功した後、ファイルに表示されているクローズ画像です。ここでは対応CSSのコードを修正する必要があります。
.uploadify-queue-item .cancel a {
background: url('../img/uploadify-cancel.png') 0 0 no-repeat;
float: right;
height: 16px;
text-indent: -9999px;
width: 16px;
}
ここurlの中のuplloadify-cancel.pngの住所を正しく設定します。アップロードされたファイルを見たら対応のキャンセルとクローズの写真が表示されます。もちろんソースを修正しないで、写真をファイルの下に置いてもいいです。2.自動アップロードを使って、ファイルの対応上のクローズをクリックすると、「オンザリング」イベントが発生しないので、対応するイベントをキャンセル画面に結びつける必要があります。
3.各画像のアップロードが成功すると、「onUploadSuccess」イベントが発生します。だから、私達はバインディング操作をonUploadSuccess関数に書いています。
4.コードは以下の通りです
onUploadSuccess:function(file, data, response) {
var cancel=$('#fileQueue .uploadify-queue-item[id="' + file.Id + '"]').find(".cancel a");
if (cancel) {
cancel.attr("deletefileid",file.id);
cancel.click(function () {
//
//1. ajax , ( )
//2. true, ; false,
var deletefileid = cancel.attr("deletefileid");
$("#uploadify").uploadify("cancel",deletefileid);// .
});
}
}
5.$(「菗uplloadify」).uploadify(「cancel」、deletefileid);これはuplloadifyのcancelメソッドを呼び出すことができますが、cancelの方法に問題があります。ソースを確認すると、cancelの方法はキューの中のファイルを削除していませんでした。フロントで対応するdivを削除しました。ファイルAをアップロードしたら、アップロードできました。画像を削除し、ファイルAのアップロードをキャンセルします。しかし、再度ファイルAをアップロードすると、ファイルAをアップロードしたということをヒントにします。これは明らかに問題があります。実際には、uplloadifyのcancel方法は、まだサーバにアップロードされていないファイルに対して、キャンセルをクリックしてキャンセルします。キャンセル方法、つまり、キャンセル方法はまだサーバにアップロードされていないファイルに対してです。
この時、ソースの変更が必要です。削除すべきファイルをキューから削除します。
cancel : function(fileID, supressEvent) {
var args = arguments;
this.each(function() {
// Create a reference to the jQuery DOM object
var $this = $(this),
swfuploadify = $this.data('uploadify'),
settings = swfuploadify.settings,
delay = -1;
if (args[0]) {
// Clear the queue
if (args[0] == '*') {
var queueItemCount = 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;
// Trigger the onClearQueue event
if (settings.onClearQueue) settings.onClearQueue.call($this, queueItemCount);
} else {
for (var n = 0; n < args.length; n++) {
swfuploadify.cancelUpload(args[n]);
/* */
delete swfuploadify.queueData.files[args[n]];
swfuploadify.queueData.queueLength = swfuploadify.queueData.queueLength - 1;
/* */
$('#' + args[n]).find('.data').removeClass('data').html(' - Cancelled');
$('#' + args[n]).find('.uploadify-progress-bar').remove();
$('#' + args[n]).delay(1000 + 100 * n).fadeOut(500, function() {
$(this).remove();
});
}
}
} else {
var item = $('#' + settings.queueID).find('.uploadify-queue-item').get(0);
$item = $(item);
swfuploadify.cancelUpload($item.attr('id'));
$item.find('.data').removeClass('data').html(' - Cancelled');
$item.find('.uploadify-progress-bar').remove();
$item.delay(1000).fadeOut(500, function() {
$(this).remove();
});
}
});
},
締め括りをつける以上はアップロードされたファイルをどのようにキャンセルするかについての方法です。もちろん自動アップロードではないなら、アップロードを変更しなくても、直接削除すればいいです。