FormData е подробно въведение и употреба https://developer.mozilla.org/zh ... ng_FormData_Objects
Методите и събитията на FormData вече са много ясни там, така че няма да губя време тук. Тази статия основно обяснява използването на FormData обекти и асинхронно качване на файлове.
Обектът FormData ни позволява да организираме колекция от двойки ключ-стойност, изпратени чрез обекта XMLHttpRequest. Основно се използва за изпращане на данни от формуляри, но може да се използва независимо от данни, предадени чрез формуляри.
1. Създаване на обект FormData от нулата
Можете да създадете собствен FormData обект и след това да добавите двойки ключ-стойност към обекта чрез метода append(), както следва:
Забележка: И двете полета "userfile" и "webmasterfile" съдържат файлове. Числото, присвоено на полето "accountnum", се преобразува директно в низ чрез метода FormData.append() (стойността на полето може да бъде blob, file или низ: ако стойността не е нито blob, нито файл, стойността се преобразува в низ).
2. Вземете обект FormData от HTML форма
За да получите FormData обект, съдържащ съществуващи данни за форма, трябва да зададете елемента на формата при създаването на обекта FormData.
Ето така:
Можете също да добавите допълнителни данни след като получите обекта FormData, като това:
Това ви позволява да добавите допълнителна информация преди изпращане, която не е непременно редактирана от потребителя.
3. Използвайте обекта FormData за изпращане на файла
Можете да използвате FormData за изпращане на файлове. Проста <form>среда може <input>да включва елемент:
След това можете да използвате следния код, за да го изпратите:
Можете също да добавите File или Blob директно към обекта FormData, като това:
При използване на метода append() може да се използва трети параметър за изпращане на името на файла (изпратен към сървъра чрез заглавието Content-Disposition). Ако третият параметър не е посочен или този параметър не се поддържа, третият параметър по подразбиране става "blob".
Ако зададете правилните опции, можете да ги използвате и с jQuery:
|
Публикувано в 8.05.2018 г. 16:30:39 ч.
|
|
|
