FormData ayrıntılı bir giriş ve kullanım niteliğindedir https://developer.mozilla.org/zh ... ng_FormData_Objects
FormData'nın yöntemleri ve olayları orada zaten çok net, bu yüzden burada onlara zaman harcamayacağım. Bu makale esas olarak FormData nesnelerinin ve asenkron dosya yüklemelerinin kullanımını açıklar.
FormData nesnesi, XMLHttpRequest nesnesi kullanılarak gönderilen anahtar-değer çiftlerinden oluşan bir koleksiyonu düzenlememizi sağlar. Öncelikle form verisi göndermek için kullanılır, ancak formlar aracılığıyla aktarılan verilerden bağımsız olarak da kullanılabilir.
1. Sıfırdan bir FormData nesnesi oluşturun
Kendi FormData nesnenizi oluşturabilir ve append() yöntemiyle nesneye anahtar-değer çiftleri ekleyebilirsiniz, şöyle:
Not: "userfile" ve "webmasterfile" alanları dosyaları içerir. "accountnum" alanına atanan sayı, FormData.append() yöntemiyle doğrudan bir diziye dönüştürülür (alanın değeri bir blob, dosya veya bir dizi olabilir: eğer değer ne bir blob ne de dosya ise, değer bir diziye dönüştürülür).
2. Bir HTML formundan bir FormData nesnesi alın
Mevcut form verisini içeren bir FormData nesnesi elde etmek için, FormData nesnesini oluştururken form öğesini belirtmeniz gerekir.
Böyle:
FormData nesnesini aldıktan sonra ek veri ekleyebilirsiniz, örneğin:
Bu, göndermeden önce ek bilgi eklemenizi sağlar, bu da mutlaka kullanıcı tarafından düzenlenmemektedir.
3. Dosyayı göndermek için FormData nesnesini kullanın
FormData kullanarak dosya gönderebilirsiniz. Basit <form>bir orta, <input>bir eleman içerebilir:
Sonra aşağıdaki kodu kullanarak gönderebilirsiniz:
Ayrıca FormData nesnesine doğrudan bir Dosya veya Blob ekleyebilirsiniz, şöyle:
append() yöntemi kullanıldığında, dosya adını (Content-Disposition başlığı üzerinden sunucuya gönderilen) göndermek için üçüncü bir parametre kullanılabilir. Üçüncü parametre belirtilmediyse veya bu parametre desteklenmiyorsa, üçüncü parametre varsayılan olarak "blob" olur.
Doğru seçenekleri ayarladığınızda, jQuery ile de kullanabilirsiniz:
|
Yayınlandı 8.05.2018 16:30:39
|
|
|
