Как настроить атрибут (input type = "file") HTML5?

-3

Ну, я попытался загрузить файл на странице .html, но я хотел бы сделать некоторые изменения. Сначала, когда я прикреплю файл, имя документа должно появиться на <p>Name of the Document: </p>, и размер должен появиться на <p>Size of Document:</p> , вот изображение, чтобы проиллюстрировать мой пример:Как настроить атрибут (input type = "file") HTML5?

Кто есть идея, как это сделать?

источник

2016-01-11 DevRyu

Вы можете сделать это, используя свойство files объекта Input FileUpload. Вот несколько примеров загрузки файлов. Если вам нужна отдельная загрузка файла, просто удалите свойство multiple элемента <input>.

HTML5 код:

<html> 
    <body onLoad="showinfo()"> 
     <input type="file" id="upfiles" size="64" onchange="showinfo()" multiple> 
     <br> 
     <div id="fileinfo"></div> 
    </body> 
</html>

Javascript:

<script type="text/javascript"> 
var showinfo = function(){ 
    var up = document.getElementById("upfiles"); 
    var info = ""; 

    if (up.files) { 
     var upf = up.files; 
     if (upf.length) { 
      for (var i = 0; i<upf.length; i++) { 
       var file = upf[i]; 
       info += "<p>" 
       info += "<b>" + (i+1) + ". File Name: </b>"; 
       info += (file.name) ? file.name + "<br>" : "N/A"; 
       info += "<b>" + (i+1) + ". File Size: </b>"; 
       info += (file.size) ? file.size + " bytes<br>" : ""; 
       info += "</p>"; 
      } 
     } else { 
      info = "Select files to be uploaded."; 
     } 
    } 
    else { 
     info = "Your browser does not support Input FileUpload object."; 
     // You may add fallback function here. 
    } 
    document.getElementById("fileinfo").innerHTML = info; 
}; 
</script>

источник

2016-01-11 20:07:37

вы Потрясающий, спасибо, я теперь узнать, как получить значение с помощью JS, спасибо так много. – DevRyu

Как настроить атрибут (input type = "file") HTML5?

ответ

Смежные вопросы