สวัสดีครับในบทความนี้จะแจกตัวอย่าง JavaScript ตรวจสอบนามสกุลไฟล์ก่อนอัพโหลด เอาไปต่อยอดทำระบบที่ต้องมีการอัพโหลดไฟล์ภาพและไฟล์เอกสารครับ
ขอแนะนำระบบพร้อมใช้ ราคาถูก ได้ Code + Database ทั้งหมด
1.เว็บอีคอมเมิร์ช คลิก
2.เว็บ FOOD POS ขายอาหารหน้าร้าน คลิก
3.เว็บ Coffee POS ขายกาแฟหน้าร้าน คลิก
4.หลังบ้านระบบอีคอมเมิร์ช คลิก
5.เว็บบริษัท / เว็บองค์กร คลิก
6.ระบบหอพัก โปรแกรมหอพัก คลิก
7.ระบบยืมคืน เบิกจ่ายพัสดุ ครุภัณฑ์ คลิก
8.ระบบแจ้งซ่อมสำหรับองค์กร คลิก
9.ระบบกระเป๋าตังค์ คลิก
10.ระบบฐานข้อมูลวิจัย คลังข้อมูลวิจัย ฐานข้อมูลวิทยานิพนธ์ Research Corpus คลิก
11.ระบบอื่นๆ เพิ่มเติม คลิก
Full code สามารถเซฟเป็น .html และทดสอบได้เลยครับ เช่น index.html
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 |
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <script type="text/javascript"> var _validFileExtensions = [".jpg", ".jpeg", ".png"]; //กำหนดนามสกุลไฟล์ที่สามรถอัพโหลดได้ function ValidateTypeFile(oForm) { var arrInputs = oForm.getElementsByTagName("input"); for (var i = 0; i < arrInputs.length; i++) { var oInput = arrInputs[i]; if (oInput.type == "file") { var sFileName = oInput.value; if (sFileName.length > 0) { var blnValid = false; for (var j = 0; j < _validFileExtensions.length; j++) { var sCurExtension = _validFileExtensions[j]; if (sFileName.substr(sFileName.length - sCurExtension.length, sCurExtension.length).toLowerCase() == sCurExtension.toLowerCase()) { blnValid = true; break; } // if (sFileName.substr(sFileName.length.... } // for (var j = 0; j < _validFileExtensions.length; j++) { //ถ้าเลือกไฟล์ไม่ถุูกต้องจะมี Alert แจ้งเตือน if (!blnValid) { alert("คำเตือน , " + sFileName + "\n ระบบรองรับเฉพาะไฟล์นามสกุล : " + _validFileExtensions.join(", ")); return false; } //if (!blnValid) { } //if (sFileName.length > 0) { } // if (oInput.type == "file") { } //for return true; } //function ValidateTypeFile(oForm) { </script> </head> <body> <!-- ถ้าเลือกไฟล์ไม่ถุูกต้องจะมี Alert แจ้งเตือน --> <form onsubmit="return ValidateTypeFile(this);" method="post" enctype="multipart/form-data"> เลือกไฟล์ : <input type="file" name="upload" /><br /> <button type="submit">Upload</button> </form> <p> ศึกษาระบบอัพโหลดไฟล์ได้ที่ https://devbanban.com/?p=4157</p> </body> </html> <! -- ref : https://stackoverflow.com/questions/4234589/validation-of-file-extension-before-uploading-file - คอร์สออนไลน์ https://devbanban.com/?p=2867 - ระบบพร้อมใช้ https://devbanban.com/?p=4425 --> |
ลองเอาไปประยุกต์ใช้ดูนะครับ
นำไปต่อยอดทำระบบ PHP MySQL คลิก.
สนใจจ้างพัฒนาระบบหรือสอนทำระบบที่อยากได้ (สอนผ่าน google meet) สามารถติดต่อมาที่แฟนเพจ เวลา 10.00 – 20.00 น.
ร่วมสนับสนุน ค่ากาแฟ ค่าโฮส devbanban.com ได้ที่
ธนาคารกรุงไทย สาขาเดอะมอลล์ท่าพระ
ชื่อบัญชี นายพิศิษฐ์ บวรเลิศสุธี เลขที่ 878-0-17747-6
————————————————————————————
ธนาคารไทยพาณิชย์ สาขามหาวิทยาลัยราชภัฏธนบุรี
ชื่อบัญชี นายพิศิษฐ์ บวรเลิศสุธี เลขที่ 406-359094-1
————————————————————————————
ธนาคารกสิกร สาขาเออร์เบิร์น สแควร์ ประชาชื่น
ชื่อบัญชี นายพิศิษฐ์ บวรเลิศสุธี เลขที่ 048-1-17571-2
fanpage : https://www.facebook.com/sornwebsites/