Dosya yükleme işi yaparken seçilen dosyaların
isimi,boyutu ve adedini alabiliriz.Bu verileri
files dom elementi ile yapıyoruz.Bu dersimiz de tek veya çoklu seçim yani
multiple olayında da verileri listeleyeceğiz.Öncelikle parametrelerini görelim.
files.length : Adeti veriyor.
files.name : İsimi veriyor.
files.size : Boyutu veriyor.
Bu şekilde verileri alıyoruz.Eğer çoklu seçim olduysa ilk seçilenin verisini
files[0].name sonrakinin
files[1].name şeklinde artırarak verileri alıyoruz.
İndir : http://ustaderslik.com/dosya/upload.rar
İncele : http://ustaderslik.com/ornek/upload.html
Genel örnek :
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>UstaDerslik</title>
<script type="text/javascript">
function veri(){
var adet=document.getElementById ("dosya").files.length;
document.getElementById ("veri").innerHTML="";
for(i=0;i<=adet;i++){
document.getElementById ("veri").innerHTML+="<b>Dosya İsimi : </b>"+document.getElementById ("dosya").files[i].name+"<br />"+"<b>Dosya Boyutu : </b>"+document.getElementById ("dosya").files[i].size+"<br /><br />";
}
}
</script>
</head>
<body>
<input type="file" id="dosya" multiple onChange="veri()" />
<br /><br />
<div id="veri"></div>
</body>
</html>
Javascript ile bu şekil de verileri alabiliyoruz.Önce adeti bulduk,ardından for ile adet kadar döngü yapıp tek tek verilerini alıp ekrana bastık.Bu işlemi
jquery de yapmak isteyenler şu şekil de yapabilir.
$(function(){
$("#dosya").change(function(){
var adet=$(this)[0].files.length;
$(".veri").empty();
for(i=0;i<=adet;i++){
$(".veri").append("<b>Dosya İsimi : </b>"+$(this)[0].files[i].name+"<br />"+"<b>Dosya Boyutu : </b>"+$(this)[0].files[i].size+"<br /><br />");
}
})
});
UstaDerslik
