Как разрешить пользователям выбирать несколько файлов из одного поля ввода, используя php и jquery?

Question

У меня есть сайт со списком аренды, где пользователи могут создавать страницы и показывать фотографии своих объявлений. Я создал форму с несколькими полями для ввода файлов, чтобы пользователи могли выбирать файлы для загрузки, а также кнопку отправки:

<form method="post" enctype="multipart/form-data">
    <input type="file" name="image_1" id="image_1" /> 
    <input type="file" name="image_2" id="image_2" /> 
    <input type="file" name="image_3" id="image_3" /> 
    <input type="submit" name="submit" value="Submit" />
</form>

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

function uploadAndResize($imageFile, $filename) {
    $folder = '../images/';
    $orig_w = 400;
    $filename = str_replace(' ', '_', $filename);

    list($width, $height) = getimagesize($imageFile);

    $src = imagecreatefromjpeg($imageFile);
    $orig_h = ($height / $width) * $orig_w;

    $tmp = imagecreatetruecolor($orig_w, $orig_h);
    imagecopyresampled($tmp, $src, 0, 0, 0, 0, $orig_w, $orig_h, $width, $height);
    imagejpeg($tmp, $folder.$filename, 100);

    imagedestroy($tmp);
    imagedestroy($src);
}

$imageFile_1 = $_FILES['image_1']['tmp_name'];
$filename_1 = basename( $_FILES['image_1']['name']);

$imageFile_2 = $_FILES['image_2']['tmp_name'];
$filename_2 = basename( $_FILES['image_2']['name']);

$imageFile_3 = $_FILES['image_3']['tmp_name'];
$filename_3 = basename( $_FILES['image_3']['name']);

uploadAndResize($imageFile_1,$filename_1);
uploadAndResize($imageFile_2,$filename_2);
uploadAndResize($imageFile_3,$filename_3);

Текущая настройка, которая у меня есть, прекрасно работает для загрузки фотографий, но я хотел бы заменить несколько полей ввода файла одним полем ввода файла, в котором можно выбрать несколько файлов одновременно. Однако я хочу, чтобы каждый выбранный файл имел атрибут name «image_» в сочетании со следующей итерацией, чтобы он хорошо работал с текущим сценарием, который я использую. Мне также нужно, чтобы она вызывала функцию для максимально возможного количества файлов.

Как разрешить пользователям выбирать несколько файлов из одного поля ввода, используя php и jquery, и при этом работать с моим текущим скриптом?

Answer 1

с использованием атрибута "mutiple" в элементах ввода формы HTML.

, например:

<input type="file" name="attacheDocument" multiple="multiple" />

возвращает массив файлов.

Answer 2

Используйте плагин для загрузки нескольких файлов jquery. Это просто. См. Ссылку ниже

http://www.fyneworks.com/jquery/multiple-file-upload/

Answer 3

На этот вопрос уже дан ответ;) - посмотрите на этот похожий вопрос;имеет несколько хороших ответов: Как выбрать несколько файлов для загрузки?

Answer 4

Я рекомендую вам http://valums.com/ajax-upload/

Сделать что-то сложно, но результат потрясающий. Разрешить:

.- Несколько файлов
.- Прогресс бар

Этот плагин содержит скрипт php, который можно легко изменить. Просто проверьте это на странице, которую я вам показал.

Answer 5

См. это отличное руководство, показывающее, как использовать многофайловый плагин jquery с php. Обратите внимание, что вам придется перебирать файлы в вашем php-коде (см. Учебник, упомянутый выше.)