Jquery Загрузить изображения в несколько экземпляров и вызвать завершение каждого экземпляра предыдущего.

Я использую Jquery Uploadify для загрузки изображений с помощью PHP, здесь у меня есть несколько экземпляров uploadify, и каждый экземпляр загружает изображения в разные папки.

Я хочу, чтобы второй экземпляр uploadify начал загрузку изображений только после того, как первый экземпляр uploadify загрузил выбранное изображение.

$('#listing_image').uploadifySettings('папка','listing_image_TempImage'); $('#listing_image').uploadifyUpload(); $('#listing_image1').uploadifySettings('папка','listing_image1_TempImage'); $('#listing_image1').uploadifyUpload();

то есть 'listing_image1' получит вызов, когда обработка 'listing_image' будет завершена. Как я могу добиться такого поведения?


person EternalSunShine    schedule 21.07.2010    source источник


Ответы (3)


Я пока не могу добавить комментарий к вашему ответу. Поэтому я пишу это здесь вместо этого.

Попробуйте выполнить одну загрузку, используя это (убедитесь, что ссылки указывают на правильные места):

$('#listing_image').uploadify({
    'uploader'  : 'uploadify.swf',
    'script'    : 'uploadify.php',
    'cancelImg' : 'cancel.png',
    'folder'    : '/listing_image_TempImage',
    onComplete: function(){ 
        // Do oncomplete stuff. 
    }
});

Когда вы можете заставить это работать, тогда вы должны быть в состоянии заставить это работать.

var uploads = [2,4,5]; // Only number 2,4 and 5
var numberofuploads = uploads.length; // How many is that?
var folderlist = [0, '/folder1', '/folder2', '/folder3', '/folder4', '/folder5', '/folder6']; // List of folders to upload to
var listingimageslist = [0, '#listing_image1', '#listing_image2', '#listing_image3', '#listing_image4', '#listing_image5', '#listing_image6']; // List of form selectors. 

var folder = folderlist[uploads[0]]; // What folder should this form upload to
var listingimages = listingimageslist[uploads[0]]; // With what selector can the form be found?
if (numberofuploads > 1)
{
    var next = 1; // What upload to initiate after this one?
}
initUpload(listingimages,folder); // make the upload thing work. 


function initUpload(e,folder)
{
    $(e).uploadify({
        'folder'    : folder,
        'uploader'  : 'uploadify.swf',
        'script'    : 'uploadify.php',
        'cancelImg' : 'cancel.png',
        onComplete: function(){ 
            var folder = folderlist[uploads[next]];
            var listingimages = listingimageslist[uploads[next]];
            next++
            if (numberofuploads != next)
            {
                initUpload(listingimages,folder);
            }
        }
    });
};

Я не тестировал код, но вы сможете заставить его работать, если немного знаете javascript.

Помните, что весь ваш код jQuery должен быть в $(document).ready следующим образом:

$(document).ready(function() {
 // Insert code here
});
person Webbies    schedule 21.07.2010
comment
Большое спасибо Webbies, но здесь у меня есть одна проблема.... я проверил первые два экземпляра, но этот код не загружает изображения для первых двух экземпляров... $('#listing_image').uploadify({ 'folder': '/listing_image_TempImage', onComplete: function(){ $('#listing_image1').uploadify({ 'folder' : '/listing_image_TempImage' }); } }); - person EternalSunShine; 21.07.2010
comment
Попробуйте сделать только одну работу, используя первый фрагмент кода, который я предоставил в этом ответе. - person Webbies; 21.07.2010

Вы можете создать функцию «обратного вызова», которая срабатывает после завершения первой загрузки.

$('#listing_image').uploadify({
 'folder'    : '/listing_image_TempImage',
 onComplete: function(){ 
  $('#listing_image1').uploadify({
   'folder'    : '/listing_image_TempImage'
  });
 }
});

При 6 (одна за другой) загрузках:

$('#listing_image').uploadify({
    'folder'    : '/listing_image_TempImage',
    onComplete: function(){ 
        $('#listing_image1').uploadify({
            'folder'    : '/listing_image_TempImage1',
            onComplete: function(){ 
                $('#listing_image2').uploadify({
                    'folder'    : '/listing_image_TempImage2',
                    onComplete: function(){ 
                        $('#listing_image3').uploadify({
                            'folder'    : '/listing_image_TempImage3',
                            onComplete: function(){ 
                                $('#listing_image4').uploadify({
                                    'folder'    : '/listing_image_TempImage4',
                                    onComplete: function(){ 
                                        $('#listing_image5').uploadify({
                                            'folder'    : '/listing_image_TempImage5'   
                                        });
                                    }   
                                });
                            }           
                        });
                    }
                });
            }
        });
    }
});

Я предполагаю, что вы говорите об этой загрузке.

Полный список доступных обратных вызовов смотрите в документации.

person Webbies    schedule 21.07.2010
comment
Спасибо за ответ. да, я говорю об одном и том же uplaodify... здесь у меня есть 6 экземпляров uploadify, так как я могу реализовать обратный вызов для всех 6 экземпляров??? ваш пример будет работать только для 2 экземпляров. - person EternalSunShine; 21.07.2010
comment
Вы говорите о том, чтобы иметь их всех один за другим. Значит, пятая будет работать только после того, как будет завершена четвертая? - person Webbies; 21.07.2010
comment
и может быть пользователь выбрал только 2-й, 4-й и 5-й экземпляры uploadify, так как мы можем справиться с этим поведением? - person EternalSunShine; 21.07.2010
comment
я только что добавил с 6, после других загрузок. но если пользователь может выбирать, какие загрузки он хочет, это немного сложнее. Вам нужны переменные. Я продемонстрирую концепцию, которую вы можете изменить, и опубликую новый ответ, когда я его получу. - person Webbies; 21.07.2010
comment
Большое спасибо Webbies, но здесь у меня есть одна проблема.... я проверил первые два экземпляра, но этот код не загружает изображения для первых двух экземпляров... $('#listing_image').uploadify({ 'folder': '/listing_image_TempImage', onComplete: function(){ $('#listing_image1').uploadify({ 'folder' : '/listing_image_TempImage' }); } }); - person EternalSunShine; 21.07.2010

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

person Pekka    schedule 21.07.2010
comment
Привет, Пекка, на самом деле теперь требования изменены ... Теперь у нас есть 6 экземпляров Uploadify, и каждый экземпляр будет иметь фиксированную папку, в которую будут загружаться изображения, поэтому здесь я хочу, чтобы второй экземпляр uplaodify вызывался только после завершения обработки первого экземпляра uploadify. Данный код не загружает изображения ' }); } }); - person EternalSunShine; 21.07.2010