مقدمة
باستخدام كائن FileReader ، يمكن لتطبيقات الويب قراءة محتوى الملفات (أو مخازن البيانات RAW) المخزنة بشكل غير متزامن (أو مخازن البيانات الخام) المخزنة على كمبيوتر المستخدم ، ويمكنها استخدام كائنات الملفات أو كائنات blob لتحديد الملف أو البيانات المراد معالجتها. يمكن أن يكون كائن الملف من كائن FileList الذي تم إرجاعه بواسطة المستخدم بعد تحديد ملف على عنصر <input type = "text" /> ، أو من كائن datatransfer الذي تم إنشاؤه بواسطة عملية السحب والإفلات ، أو من نتيجة الإرجاع بعد تنفيذ طريقة mozgetasfile () على htmlcanvaselement.
صفحات متعددة ، تحميل رموز تجريبية صور متعددة
<! doctype html> <html> <head> <title> قم بتحميل الصورة لعرض صورة المعاينة </title> <style> #result img {height: 100px ؛ العرض: كتلة مضمنة. يمين الهامش: 10px ؛ هامش القاع: 10 بكسل ؛ } </style> </head> <body> <viv> <p> <label> الرجاء تحديد ملف صورة: </label> <input type = "file" id = "file_input" style = "display: none ؛" /> </p> <div id = "result"> <a href = "javaScript: void (0) ؛"> إضافة صورة </a> </viv> </viv> <v> <p> <blabe> الرجاء تحديد ملف صورة: </label> <input type = "file" id = "file_input" style = "display: none ؛" /> </p> <div id = "result"> <a href = "javaScript: void (0) ؛"> إضافة صورة </a> </viv> </viv> <script src = "jquery -2.2.1.min.js"> </script> <script> $ (". add_bbtn"). $ (this) .Parents (". add_imgs". "آسف ، لا يدعم متصفحك FileReader" ؛ input.setAttribute ("معطل" ، "معطل") ؛ } آخر {$ (input) .UNBIND ("change"). on ("change" ، function () {var file = this.files [0] ؛ if (!/image //// الدالة (e) {$ (result) .Append ('<img src = "'+this.result+'"/>') ؛ما سبق هو كل شيء عن هذا المقال ، وآمل أن يكون من المفيد للجميع تعلم برمجة JavaScript.