{"json_modified": "2016-10-12T12:26:21.505532", "uuid": "490f3bfc-0be2-4f40-a200-5035f37b8b98", "title": "Using files from web applications", "url": "/en-US/docs/Using_files_from_web_applications", "tags": ["NeedsUpdate", "Files", "MakeBrowserAgnostic", "ajax upload", "upload", "HTML5", "Intermediate"], "translations": [{"uuid": "c7d40802-8f92-4105-94a9-b05c56253c9a", "title": "Zugriff auf Dateien von Webapplikationen", "url": "/de/docs/Zugriff_auf_Dateien_von_Webapplikationen", "tags": [], "summary": "Mithilfe der File API, welche mit HTML5 zum DOM hinzugef\u00fcgt wurde, ist es nun f\u00fcr Webinhalte m\u00f6glich den Benutzer lokale Dateien ausw\u00e4hlen zu lassen und den Inhalt dieser Dateien auszulesen. Die Auswahl kann entweder durch das HTML Element\u00a0<a href=\"/de/docs/Web/HTML/Element/input\" title=\"Das&#xA0;HTML Element&#xA0;&lt;input&gt;&#xA0;erm&#xF6;glicht es, interaktive Bedienelemente f&#xFC;r webbasierte Formulare zu erstellen.\"><code>&lt;input&gt;</code></a> oder durch Drag and Drop erfolgen.", "localization_tags": ["inprogress"], "locale": "de", "last_edit": "2016-07-27T07:31:50", "review_tags": []}, {"uuid": "c09704fd-8375-4b38-a241-f34fbd9ffb98", "title": "Utilizar ficheros desde aplicaciones web", "url": "/es/docs/Using_files_from_web_applications", "tags": ["NecesitaActualizar", "Basura", "Ficheros", "Subir", "HTML5", "HacerNavegadorAgn\u00f3stico", "Intermedio"], "summary": "", "localization_tags": [], "locale": "es", "last_edit": "2016-02-10T01:55:06", "review_tags": []}, {"uuid": "123c4e95-116d-43ff-bcc7-0c9ec5f8d990", "title": "Utiliser des fichiers \u00e0 partir d'applications web", "url": "/fr/docs/Using_files_from_web_applications", "tags": [], "summary": "En utilisant l'API de manipulation de fichier, qui a \u00e9t\u00e9 ajout\u00e9e au DOM dans le HTML5, il est maintenant possible depuis une application web de proposer \u00e0 l'utilisateur de s\u00e9lectionner des fichiers locaux, puis d'en lire le contenu. Cette s\u00e9lection peut s'effectuer soit en utilisant un \u00e9l\u00e9ment HTML <a href=\"/fr/docs/Web/HTML/Element/input\" title=\"L'&#xE9;l&#xE9;ment HTML &lt;input&gt; est utilis&#xE9; pour cr&#xE9;er des contr&#xF4;les interactifs dans les formulaires web.\"><code>&lt;input&gt;</code></a>, soit avec un glisser-d\u00e9poser.", "localization_tags": [], "locale": "fr", "last_edit": "2016-06-30T03:28:52", "review_tags": []}, {"uuid": "497b5c87-f537-4e0e-8530-ee2c08e66f48", "title": "Web \u30a2\u30d7\u30ea\u30b1\u30fc\u30b7\u30e7\u30f3\u304b\u3089\u30d5\u30a1\u30a4\u30eb\u3092\u6271\u3046", "url": "/ja/docs/Using_files_from_web_applications", "tags": [], "summary": "HTML5 \u304b\u3089 DOM \u306b\u8ffd\u52a0\u3055\u308c\u305f File API \u306b\u3088\u3063\u3066\u3001Web \u30da\u30fc\u30b8\u304c\u30e6\u30fc\u30b6\u306b\u81ea\u8eab\u306e\u74b0\u5883\u4e0b\u306e\u30d5\u30a1\u30a4\u30eb\u3092\u8981\u6c42\u3057\u3001\u305d\u306e\u5185\u5bb9\u3092\u8aad\u307f\u8fbc\u3081\u308b\u3088\u3046\u306b\u306a\u308a\u307e\u3057\u305f\u3002\u30d5\u30a1\u30a4\u30eb\u306e\u9078\u629e\u306f HTML \u306e  <a href=\"/ja/docs/Web/HTML/Element/input\" title=\"HTML &lt;input&gt; &#x8981;&#x7D20;&#x306F;&#x3001;Web &#x30D9;&#x30FC;&#x30B9;&#x306E;&#x30D5;&#x30A9;&#x30FC;&#x30E0;&#x7528;&#x306E;&#x30A4;&#x30F3;&#x30BF;&#x30E9;&#x30AF;&#x30C6;&#x30A3;&#x30D6;&#x306A;&#x30B3;&#x30F3;&#x30C8;&#x30ED;&#x30FC;&#x30EB;&#x3092;&#x4F5C;&#x6210;&#x3059;&#x308B;&#x305F;&#x3081;&#x306B;&#x4F7F;&#x7528;&#x3057;&#x307E;&#x3059;&#x3002;\"><code>&lt;input&gt;</code></a> \u8981\u7d20\u3082\u3057\u304f\u306f\u30c9\u30e9\u30c3\u30b0\uff06\u30c9\u30ed\u30c3\u30d7\u304b\u3089\u884c\u3048\u307e\u3059\u3002", "localization_tags": [], "locale": "ja", "last_edit": "2012-08-15T14:14:10", "review_tags": []}, {"uuid": "3de2889d-8ceb-43c8-9453-519611c950b8", "title": "Using files from web applications", "url": "/pt-BR/docs/Using_files_from_web_applications", "tags": [], "summary": "Usando a File API adicionada ao DOM em HTML5, agora \u00e9 poss\u00edvel para conte\u00fado web solicitar ao usu\u00e1rio para selecionar arquivos locais, e ent\u00e3o ler o conte\u00fado desses arquivos. Essa sele\u00e7\u00e3o pode ser feita usando um elemento HTML <a href=\"/pt-BR/docs/HTML/Element/input\" title=\"This article hasn't been written yet. Please consider contributing!\"><code>&lt;input&gt;</code></a> ou por arrastar e soltar.", "localization_tags": [], "locale": "pt-BR", "last_edit": "2012-10-27T16:51:18", "review_tags": []}, {"uuid": "92474c33-5672-4c66-92a1-b2274144c991", "title": "\u0418\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 \u0444\u0430\u0439\u043b\u043e\u0432 \u0432 \u0432\u0435\u0431 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f\u0445", "url": "/ru/docs/Using_files_from_web_applications", "tags": [], "summary": "\u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044f File API, \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u043d\u044b\u0439 \u043a DOM \u0432 HTML5, \u0432 \u0432\u0435\u0431-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f\u0445 \u0442\u0435\u043f\u0435\u0440\u044c \u043c\u043e\u0436\u043d\u043e \u0437\u0430\u043f\u0440\u0430\u0448\u0438\u0432\u0430\u0442\u044c \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u0432\u044b\u0431\u0440\u0430\u0442\u044c \u043b\u043e\u043a\u0430\u043b\u044c\u043d\u044b\u0435 \u0444\u0430\u0439\u043b\u044b \u0438 \u0437\u0430\u0442\u0435\u043c \u0447\u0438\u0442\u0430\u0442\u044c \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435 \u044d\u0442\u0438\u0445 \u0444\u0430\u0439\u043b\u043e\u0432. \u0412\u044b\u0431\u043e\u0440 \u0444\u0430\u0439\u043b\u043e\u0432 \u043c\u043e\u0436\u0435\u0442 \u043e\u0441\u0443\u0449\u0435\u0441\u0442\u0432\u043b\u044f\u0442\u044c\u0441\u044f \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 <a href=\"/ru/docs/Web/HTML/Element/input\" title=\"&#x42D;&#x43B;&#x435;&#x43C;&#x435;&#x43D;&#x442;&#xA0;HTML &lt;input&gt;&#xA0;&#x438;&#x441;&#x43F;&#x43E;&#x43B;&#x44C;&#x437;&#x443;&#x435;&#x442;&#x441;&#x44F; &#x434;&#x43B;&#x44F; &#x441;&#x43E;&#x437;&#x434;&#x430;&#x43D;&#x438;&#x44F; &#x438;&#x43D;&#x442;&#x435;&#x440;&#x430;&#x43A;&#x442;&#x438;&#x432;&#x43D;&#x44B;&#x445; &#x44D;&#x43B;&#x435;&#x43C;&#x435;&#x43D;&#x442;&#x43E;&#x432; &#x443;&#x43F;&#x440;&#x430;&#x432;&#x43B;&#x435;&#x43D;&#x438;&#x44F; &#x432; &#x432;&#x435;&#x431;-&#x444;&#x43E;&#x440;&#x43C;&#x430;&#x445;.\"><code>&lt;input&gt;</code></a> \u0438\u043b\u0438 drag and drop.<br/><br/>\n \u0415\u0441\u043b\u0438 \u0432\u044b \u0445\u043e\u0442\u0438\u0442\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c DOM File API \u0432 \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u044f\u0445 \u0438\u043b\u0438 \u043a\u043e\u0434\u0435 Chrome, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435. \u041d\u0430 \u0441\u0430\u043c\u043e\u043c \u0434\u0435\u043b\u0435, \u0432 \u0442\u0430\u043a\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u0432\u0430\u043c \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u043e\u0437\u043d\u0430\u043a\u043e\u043c\u0438\u0442\u044c\u0441\u044f \u0441 \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u043c\u0438 \u043d\u044e\u0430\u043d\u0441\u0430\u043c\u0438. \u0421\u043c. \u0441\u0442\u0430\u0442\u044c\u044e <a href=\"/en/Extensions/Using_the_DOM_File_API_in_chrome_code\" title=\"en/Extensions/Using the DOM File API in chrome code\">Using the DOM File API in chrome code</a> \u0434\u043b\u044f \u043f\u043e\u0434\u0440\u043e\u0431\u043d\u043e\u0441\u0442\u0435\u0439.", "localization_tags": ["inprogress"], "locale": "ru", "last_edit": "2016-10-12T12:26:11", "review_tags": []}, {"uuid": "f5a54add-c808-4369-a083-dc41674c4f88", "title": "\u5728web\u5e94\u7528\u4e2d\u4f7f\u7528\u6587\u4ef6", "url": "/zh-CN/docs/Using_files_from_web_applications", "tags": ["Files", "\u4e0a\u4f20", "\u6587\u4ef6", "HTML5", "\u5f02\u6b65\u4e0a\u4f20"], "summary": "<span style=\"font-size: 14px; line-height: 1.5;\">\u4f7f\u7528HTML5 DOM\u65b0\u589e\u7684File API\uff0c\u73b0\u5728\u53ef\u4ee5\u8ba9\u7f51\u9875\u8981\u6c42\u7528\u6237\u9009\u62e9\u672c\u5730\u6587\u4ef6\uff0c\u5e76\u4e14\u8bfb\u53d6\u8fd9\u4e9b\u6587\u4ef6\u7684\u4fe1\u606f\u4e86\u3002\u9009\u62e9\u7684\u65b9\u5f0f\u65e2\u53ef\u4ee5\u662fHTML</span><span style=\"font-size: 14px; line-height: 1.5;\"><a href=\"/zh-CN/docs/Web/HTML/Element/input\" title=\"input (&lt;input&gt;) \u5143\u7d20\u7528\u6765\u521b\u5efa\u57fa\u4e8eweb\u8868\u5355\u7684\u53ef\u4ea4\u4e92\u63a7\u4ef6.\"><code>&lt;input&gt;</code></a>\u00a0</span><span style=\"font-size: 14px; line-height: 1.5;\">\u5143\u7d20\uff0c\u4e5f\u53ef\u4ee5\u662f\u62d6\u62fd \u3002</span>", "localization_tags": [], "locale": "zh-CN", "last_edit": "2015-12-30T04:40:35", "review_tags": []}, {"uuid": "fc1d5ed2-b772-4294-87b5-b3158b4806b3", "title": "\u5728\u7db2\u9801\u61c9\u7528\u7a0b\u5f0f\u4e2d\u4f7f\u7528\u672c\u5730\u6a94\u6848", "url": "/zh-TW/docs/Using_files_from_web_applications", "tags": ["\u5f85\u7ffb\u8b6f"], "summary": "", "localization_tags": ["inprogress"], "locale": "zh-TW", "last_edit": "2016-07-18T18:13:59", "review_tags": []}], "modified": "2016-10-07T12:51:44", "label": "Using files from web applications", "localization_tags": [], "locale": "en-US", "id": 2218, "last_edit": "2016-10-07T12:51:35", "summary": "Using the File API, which was added to the DOM in HTML5, it's now possible for web content to ask the user to select local files and then read the contents of those files. This selection can be done by either using an HTML <a href=\"/en-US/docs/Web/HTML/Element/input\" title=\"The HTML element &lt;input&gt; is used to create interactive controls for web-based forms in order to accept data from the user. How an &lt;input&gt; works varies considerably depending on the value of its type attribute.\"><code>&lt;input&gt;</code></a> element or by drag and drop.", "sections": [{"id": "Accessing_selected_file(s)", "title": "Accessing selected file(s)"}, {"id": "Accessing_selected_file(s)_on_a_change_event", "title": "Accessing selected file(s) on a change event"}, {"id": "Dynamically_adding_a_change_listener", "title": "Dynamically adding a change listener"}, {"id": "Getting_information_about_selected_file(s)", "title": "Getting information about selected file(s)"}, {"id": "Example_Showing_file(s)_size", "title": "Example: Showing file(s) size"}, {"id": "Using_hidden_file_input_elements_using_the_click()_method", "title": "Using hidden file input elements using the click() method"}, {"id": "Using_a_label_element_to_trigger_a_hidden_file_input_element", "title": "Using a label element to trigger a hidden file input element"}, {"id": "Selecting_files_using_drag_and_drop", "title": "Selecting files using drag and drop"}, {"id": "Example_Showing_thumbnails_of_user-selected_images", "title": "Example: Showing thumbnails of user-selected images"}, {"id": "Using_object_URLs", "title": "Using object URLs"}, {"id": "Example_Using_object_URLs_to_display_images", "title": "Example: Using object URLs to display images"}, {"id": "Example_Uploading_a_user-selected_file", "title": "Example: Uploading a user-selected file"}, {"id": "Creating_the_upload_tasks", "title": "Creating the upload tasks"}, {"id": "Handling_the_upload_process_for_a_file", "title": "Handling the upload process for a file"}, {"id": "Handling_the_upload_process_for_a_file_asynchronously", "title": "Handling the upload process for a file, asynchronously"}, {"id": "Example_Using_object_URLs_to_display_PDF", "title": "Example: Using object URLs to display PDF"}, {"id": "Example_Using_object_URLs_with_other_file_types", "title": "Example: Using object URLs with other file types"}, {"id": "Specification", "title": "Specifications"}, {"id": "See_also", "title": "See also"}], "slug": "Using_files_from_web_applications", "review_tags": []}