плагин загрузки файла jquery: как использовать обратные вызовы? - PullRequest
4 голосов
/ 14 марта 2012

Я пытаюсь реализовать плагин для загрузки файла blue imp jquery из: https://github.com/blueimp/jQuery-File-Upload/, как часто уже говорилось, документация очень подробная, но для меня, как новичка в jquery, не совсем понятно.

Я думаю, что у меня практически нулевой опыт работы с jquery, поэтому, если кто-нибудь сможет мне помочь или дать мне его, я буду очень рад!

Я попытался настроить базовую реализацию, как она есть ввики и сохранили следующее как 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")});

Я также пытался использовать просто (ОБНОВЛЕНИЕ: все еще не работает):

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

, как сказано в вики, но безэффект.

Я использую код в неправильном месте?Сам код должен быть в порядке, я думаю ...

Заранее благодарен за любую подсказку!

Ответы [ 2 ]

2 голосов
/ 05 ноября 2014

Вы можете использовать функцию обратного вызова fileuploadprogressall и сравнить внутри загруженных и итоговых данных:

$('#fileupload').fileupload({
  ...
}).bind('fileuploadprogressall', function (e, data) {
        if(data.loaded==data.total) {
             console.log("All photos have been done");
        }
});
1 голос
/ 06 июня 2013

Если вы связываетесь с 'fileuploadcompleted', вы можете инициировать действия при загрузке изображений.

Это можно сделать, связав привязку с концом вашей загрузки файла.Например:

$('#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")});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...