Question

自从我开发Flickr界面以来，我有一个问题链接。虽然我不是用PHP，C ++，Java等语言开发代码的新手，但有些事情我在课堂上一定要错过，因为我只是不明白该做什么，或者更重要的是如何思考。 / p>

当我从桌面上传文件时，它可以通过用于上传的输入访问，但实际文件数据位于何处？当我使用以下方法获取数据时，我得到一个带有一些细节的File对象，但缺少原始数据。为什么呢？

function processUpload(event) {
    "use strict";

    var container = document.getElementById("imageContainer"),
        data = event.target.files,
        file = null,
        i = null;

    while (container.childNodes.length > 0) {
        container.removeChild(container.childNodes[0]);
    }
    for (i = 0; file = data[i]; i++) {
        if (!file.type.match('image.*')) {
            continue;
        }
        files.push(file);
    }
    loadImages();
}

在我目前的Flickr界面代码中，我可以从他们的Feeds加载数据并获取图像，但这些图像与我从桌面加载的图像类型不同。要从这些数据中创建File对象，请在我的JavaScript代码中执行以下操作。我是jQuery的新手，可以原谅这个烂摊子。如何更新下面的代码，以便创建与图像相同类型的File对象，就好像我要从桌面上传一样？也许它现在并不重要，但我宁愿在继续使用这个Flickr界面之前它们是相同的类型。

function fetchImages() {
    var blob = [
        new Blob([], {}), [], new Uint16Array([32])
    ];

    $.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?", {
        tagmode: "any",
        format: "json",
    }, function (data) {
        for (var i = 0; data.items.length; i++) {
            files.push(new File(blob, data.items[i].media.m, {
                type: 'image/jpeg'
            }));
            if (i === data.items.length - 1) {
                loadImages();
            }
        }
    });
}

下面的FileReader代码。有人可以解释这个代码背后的逻辑，它可以工作，但我不是只有JavaScript的经验？为什么文件数组中的数据会被给出两次？

var reader = new FileReader();
reader.onload = (function (file) {
    return function (f) {
        // do something with the image...
        // f.target.result gets the value used for the src attribute
        // what do I need to do here to convert it into a File object that is equal to a typical file upload?
    };
}) (files[i]); // why?
reader.readAsDataURL(files[i]); // why again?

谢谢！

亲切的问候理查德

JavaScript，文件和Blob对象

0 个答案: