Отправка multipart / formdata с помощью jQuery.ajax

Question

У меня проблема с отправкой файла на серверный PHP-скрипт с использованием ajax-функции jQuery. Можно получить список файлов с $('#fileinput').attr('files'), но как отправить эти данные на сервер? Результирующий массив ($_POST) на серверном php-скрипте равен 0 (NULL) при использовании файла-ввода.

Я знаю, что это возможно (хотя я до сих пор не нашел решений jQuery, только код Prototye (http://webreflection.blogspot.com/2009/03/safari-4-multiple-upload-with-progress.html)).

Это кажется относительно новым, поэтому, пожалуйста, не упоминайте, что загрузка файла будет невозможна через XHR / Ajax, потому что он определенно работает.

Мне нужна функциональность в Safari 5, FF и Chrome были бы хороши, но не обязательны.

Мой код сейчас:

$.ajax({
    url: 'php/upload.php',
    data: $('#file').attr('files'),
    cache: false,
    contentType: 'multipart/form-data',
    processData: false,
    type: 'POST',
    success: function(data){
        alert(data);
    }
});

Answer 1

В настоящее время вам даже не нужен jQuery :) получить таблицу поддержки API

let result = fetch('url', {method: 'POST', body: new FormData(document.querySelector("#form"))})

Answer 2

Старые версии IE не поддерживают FormData (полный список поддержки браузера для FormData находится здесь: https://developer.mozilla.org/en-US/docs/Web/API/FormData).

Либо вы можете использовать плагин jquery (например, http://malsup.com/jquery/form/#code-samples), либо вы можете использовать решение на основе IFrame для публикации данных из нескольких форм через ajax: https://developer.mozilla.org/en-US/docs/Learn/HTML/Forms/Sending_forms_through_JavaScript

Answer 3

1. получить объект формы по jquery-> $ ("# id") [0]
2. data = new FormData ($ ("# id") [0]);
3. хорошо, данные - ваше желание