Сделал вывод процесса загрузски

2026-05-21 22:30:56 +03:00
parent b903cca6e2
commit 8d5ab828c1
3 changed files with 72 additions and 12 deletions
--- a/index.html
+++ b/index.html
@@ -5,10 +5,25 @@
   <script src="lib_chunk_file.js"></script>
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Document</title>
+
+   <style>
+      li {
+         padding: 10px 15px;
+         list-style: none;
+         border:solid 1px #ddd;
+         border-radius: 5px;
+         width: max-content;
+      }
+
+      li span {
+         display: inline-block;
+         margin: 0 15px 0 0;
+      }
+   </style>
 </head>
 <body>
   
-   <input type="file" name="file_name">
+   <input type="file" multiple name="file_name">


   <script>
@@ -16,13 +31,43 @@

      fileInput.addEventListener('change', (event) => {
         
+         statuss= document.createElement("ul");
+      
+         event.target.after(statuss);
+
         const files = event.target.files;
-         const file = files[0]
-         if (file) {
-            uploadFileInChunks(file);
-         }else{
-            alert("no file")
-         }
+         
+         for (fil in files){
+            file = files[fil]
+  
+
+            if (file.size) {
+
+               console.log(">>>>>>>>",fil)
+
+               li = document.createElement("li");
+            
+               namefile = document.createElement("span");
+               namefile.innerHTML =file.name;
+
+               chanh = document.createElement("b");
+               chanh.id="status_bar_"+fil
+               chanh.innerHTML = 0;
+
+               full = document.createElement("b");
+               full.innerHTML = " / " + Number(file.size/1024/1024).toFixed(2);
+
+               li.append(namefile);
+               li.append(chanh);
+               li.append(full);
+
+               statuss.append(li);
+
+
+               uploadFileInChunks(file,fil);
+                  
+            }
+         }   
      });
   </script>
 </body>