[jquery] Dosya yüklemelerini dinamik olarak nasıl eklerim?

Question

Birden fazla dosya yüklemek istiyorum, bu yüzden jquery aracılığıyla dinamik olarak yükleme alanları eklemek istiyorum. Şimdi "başka bir alan ekle" gibi bir düğmem varsa ve yeni yüklemeyi forma eklerseniz yapabilirim, ancak bunu biraz daha farklı yapmak istiyorum.

İlk olarak, kullanıcının karşıya yüklenecek bir dosyayı seçtikten sonra hemen başka bir yükleme alanı eklemek istiyorum formunda bir giriş alanı olmalıdır. Bunu nasıl yapacağınız hakkında bir fikrin var mı?

Answer 1

input eleman zaman form alanı değişiklikleri kovuluyor bir change olayı vardır. Yani: açıkça yeni elemana olay kanca gerekmez anlamına gelir delegate kullanır

$('selector_for_your_form').delegate('input[type=file]', 'change', function() { 
    var form = $(this).closest('form'); 
    form.append(/* ... markup for the new field ... */); 
}); 

. Ne yazık ki, change bazı tarayıcılarda hemen patlamaz:

Live example

Güncelleme (I İşaretlemenizin   — daha gösterilmektedir daha iyi görünümlü kesinlikle biraz daha ilginç   — ve olacağını varsayıyorum) (Kullanıcı, odağı IE7 alanından uzaklaşana kadar bekler). jQuery, olayı doğrudan bağlarsanız, ancak delegate kullanırsanız bu tuhaflığı sizin için halleder. Yani burada alternatif var: İşaretlemenizin (ki ben öyle olduğunu varsayıyorum) sadece input kendisinden daha karmaşıktır

$('selector_for_your_form input[type=file]').change(fileChangeHandler); 
function fileChangeHandler() { 
    var form = $(this).closest('form'); 
    $('<input type="file">').change(fileChangeHandler).appendTo(form); 
} 

varsa, doğru elemana change çengel emin olmak gerekir. Endişeye gerek yok, yardım memnun:

Live example

Answer 2

Böyle bir şey deneyebilirsiniz.

<input type="file" name="file" onChange="if ($(this).val() != '' {addNewfileInput();}">