ใช้แอตทริบิวต์ multiple บน <input type="file"> เพื่อให้อัปโหลดหลายไฟล์ได้ แอตทริบิวต์นี้ทำงานกับ type file และ email
จำกัดจำนวนไฟล์ด้วย JavaScript
HTML ไม่มีแอตทริบิวต์จำกัดจำนวนไฟล์โดยตรง ต้องใช้ JavaScript ตรวจสอบก่อนส่งฟอร์ม
ตัวอย่าง: จำกัดสูงสุด 3 ไฟล์
<!DOCTYPE html> <html> <head> <title>HTML file upload</title> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> </head> <body> <form> <input type="file" name="files" multiple><br/> อัปโหลดหลายไฟล์ (สูงสุด 3 ไฟล์) <br> <input type="submit" value="Submit"> </form> <script> $("form").on("submit", function(e){ var files = $("input[type='file']")[0].files; if (files.length > 3){ alert("อัปโหลดได้สูงสุด 3 ไฟล์เท่านั้น"); e.preventDefault(); } }); </script> </body> </html>
ตรวจสอบ files.length ใน event submit ใช้ e.preventDefault() ยกเลิกการส่งฟอร์มถ้าเกินจำนวนที่กำหนด