From 074785cea106179cb3305637055ab0a009ca74f2 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:42:52 -0500 Subject: initial commit --- .../ru/web/api/filereader/readasdataurl/index.html | 64 ++++++++++++++++++++++ 1 file changed, 64 insertions(+) create mode 100644 files/ru/web/api/filereader/readasdataurl/index.html (limited to 'files/ru/web/api/filereader/readasdataurl/index.html') diff --git a/files/ru/web/api/filereader/readasdataurl/index.html b/files/ru/web/api/filereader/readasdataurl/index.html new file mode 100644 index 0000000000..fe755489e9 --- /dev/null +++ b/files/ru/web/api/filereader/readasdataurl/index.html @@ -0,0 +1,64 @@ +--- +title: FileReader.readAsDataURL() +slug: Web/API/FileReader/readAsDataURL +translation_of: Web/API/FileReader/readAsDataURL +--- +

{{APIRef("File API")}}

+ +

Метод readAsDataURL используется для чтения содержимог указанного {{domxref("Blob")}} или {{domxref("File")}}.Когда операция закончится, {{domxref("FileReader.readyState","readyState")}} примет значение DONE, и будет вызвано событие {{event("loadend")}}. В то же время, аттрибут  {{domxref("FileReader.result","result")}} будет содержать данные как URL, представляющий файл, кодированый в base64 строку.

+ +

Синтаксис

+ +
instanceOfFileReader.readAsDataURL(blob);
+ +

Параметры

+ +
+
blob
+
{{domxref("Blob")}} или{{domxref("File")}} которые следует прочитать.
+
+ +

Пример

+ +

HTML

+ +
<input type="file" onchange="previewFile()"><br>
+<img src="" height="200" alt="Image preview...">
+ +

JavaScript

+ +
function previewFile() {
+  var preview = document.querySelector('img');
+  var file    = document.querySelector('input[type=file]').files[0];
+  var reader  = new FileReader();
+
+  reader.onloadend = function () {
+    preview.src = reader.result;
+  }
+
+  if (file) {
+    reader.readAsDataURL(file);
+  } else {
+    preview.src = "";
+  }
+}
+ +

Результат

+ +

{{EmbedLiveSample("%D0%9F%D1%80%D0%B8%D0%BC%D0%B5%D1%80", "100%", 240)}}

+ +
Примечание: FileReader() конструктор не поддерживается Internet Explorer до 10 версии. Для полностью совместимого решения прочтите crossbrowser possible solution for image preview. Смотрите так же this more powerful example.
+ +

Спецификации

+ +

{{page("/en-US/docs/Web/API/FileReader","Specifications")}}

+ +

Совместимость с браузерами

+ +

{{page("/en-US/docs/Web/API/FileReader","Browser compatibility")}}

+ +

Смотрите так же

+ + -- cgit v1.2.3-54-g00ecf