jquery文件上傳插件：如何使用回調？

Question

我試圖實現藍色imp jquery文件上傳插件來自： https ： //github.com/blueimp/jQuery-File-Upload/，因為經常說文檔非常詳細，但對我來說，作為jquery的初學者並不是真的可以理解。

我想我基本上可以說jquery幾乎沒有經驗，所以如果有人能幫助我或給我一個他我會很高興！

我試圖在wiki中設置基本實現，並將其保存為index.html：

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>jQuery File Upload Example</title>
</head>

<body>

<input id="fileupload" type="file" name="files[]" multiple>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="js/vendor/jquery.ui.widget.js"></script>
<script src="js/jquery.iframe-transport.js"></script>
<script src="js/jquery.fileupload.js"></script>
<script>

$(function () {
    $('#fileupload').fileupload({
        dataType: 'json',
        url: 'server/php/',
        done: function (e, data) {
            $.each(data.result, function (index, file) {
                $('<p/>').text(file.name).appendTo(document.body);
            });
        }
    });
});

</script>

</body> 
</html>

我想要做的是顯示已在同一頁面上傳的圖像。 我認為我需要在上傳完成時在回調中執行此操作。 但是，我不知道在哪里放置代碼......

因此，要找出放置任何代碼的位置，我只是嘗試獲取警報框並添加此代碼 更新：現在有效：

$('#fileupload').bind('fileuploaddone', function (e, data) {alert("Message","Titel")});

我也試過簡單地使用（UPDATE：仍然不起作用）：

$('#fileupload').fileupload('disable');

正如維基中所述，但沒有效果。

我在錯誤的地方使用代碼嗎？ 代碼本身應該沒問題我猜...

提前感謝任何提示！

Answer 1

您可以使用fileuploadprogressall回調函數並在已加載和總數據內進行比較：

$('#fileupload').fileupload({
  ...
}).bind('fileuploadprogressall', function (e, data) {
        if(data.loaded==data.total) {
             console.log("All photos have been done");
        }
});

Answer 2

如果綁定到'fileuploadcompleted'，則可以在上載圖像時觸發操作。

這可以通過將綁定鏈接到fileupload的末尾來完成。 例如：

$('#fileupload').fileupload({
    dataType: 'json',
    url: 'server/php/',
    done: function (e, data) {
        $.each(data.result, function (index, file) {
            $('<p/>').text(file.name).appendTo(document.body);
        });
    }
}).bind('fileuploadcompleted', function (e, data) {alert("Message","Title")});

或者在fileupload函數調用之下的任何地方使用：

$('#fileupload').bind('fileuploadcompleted', function (e, data) {alert("Message","Title")});

jquery文件上傳插件：如何使用回調？

問題描述

2 個解決方案

解決方案1
2 2014-11-05 00:01:33

解決方案2
1 2013-06-06 12:14:56

jquery文件上傳插件：如何使用回調？

問題描述

2 個解決方案

解決方案1 2 2014-11-05 00:01:33

解決方案2 1 2013-06-06 12:14:56

解決方案1
2 2014-11-05 00:01:33

解決方案2
1 2013-06-06 12:14:56