Add file type indicator to file input test

n0samu · Nov 19, 2023 · 248e22b · 248e22b
1 parent 2754367
commit 248e22b
Showing 1 changed file with 12 additions and 0 deletions.
diff --git a/fileInputTest2.html b/fileInputTest2.html
@@ -8,6 +8,18 @@
 
     <h1>File Input Test</h1>
     <input type="file" accept=".*" id="local-file" />
+    <div id="type"></div>
+
+    <script type="text/javascript">
+        const fileInput = document.getElementById("local-file");
+        const txtDiv = document.getElementById("type");
+        fileInput.addEventListener('change', (e) => {
+            if (fileInput.files.length > 0) {
+                const file = fileInput.files[0];
+                txtDiv.textContent = file.type;
+            }
+        });
+    </script>
 
 </body>
 </html>