حدد مجلدًا محليًا على Html، واقرأ جميع الصور الموجودة في المجلد والمجلدات الفرعية تلقائيًا واعرضها على الصفحة.
التحليل الفني:
هناك مشكلةاتصل بطريقة readAsDataURL في واجهة Web API FileReader لقراءة البيانات (مسار الملف الذي تم الحصول عليه بواسطة علامة الملف لمعلمة الوظيفة هذه)، ثم قم بتحميل البيانات في FileReader (تنسيق base64). بعد ذلك، يمكنك استخدام Img تحديد البيانات المصدر بتنسيق base64 يمكن رسمها.
رمزان<!DOCTYPE html><html><head> <title>ReadImageDemo</title></head><body> <input type=file id=selectFiles onchange=dealSelectFiles() multi webkitdirectory> <canvas id=myCanvas width=1440 height=900></canvas> <script type=text/javascript> var imgPosX = 0; var imgWidth = 256؛ var Reader = new FileReader(); Reader.readAsDataURL(file); Reader.onloadend = function(){ /// بيانات الصفقة var img = new Image(); /// بعد التحميل، يتم تخزين محتوى الملف نتيجة img.src = this.result; img.onload = function(){ var myCanvas = document.getElementById(myCanvas); '2d'); cxt.drawImage(img, imgPosX, 0); } } } </script></body></html>ثلاثة آثار
ما ورد أعلاه هو المحتوى الكامل لهذه المقالة وآمل أن يكون مفيدًا لدراسة الجميع وآمل أيضًا أن يدعم الجميع شبكة VeVb Wulin.