Question

在JQuery中，我如何从url获取图像元素？

例如，

<input type="file" id="fileInput"/>
var fileInput = document.getElementById('fileInput');

这是通过html5中的文件选择器完成的。但是，我怎么能从url获得图像？

我的要求是从网址获取图片。

    var fileInput = document.getElementById('fileInput');  //instead of this how could i get element from url
    var fileDisplayArea = document.getElementById('fileDisplayArea');


    fileInput.addEventListener('change', function(e) {
        var file = fileInput.files[0];
        var imageType = /image.*/;

        if (file.type.match(imageType)) {
            var reader = new FileReader();

            //save to file api  
        } else {
            fileDisplayArea.innerHTML = "File not supported!";
        }
    });

请帮忙，谢谢

Answer 1

这样做：

var fileInput = document.getElementById（'fileInput'）; //而不是这个怎么能从url获取元素 var fileDisplayArea = document.getElementById（'fileDisplayArea'）;

fileInput.addEventListener('change', function(e) {
    var file = fileInput.files[0];
    var imageType = /image.*/;

    if (file.type.match(imageType)) {
        var reader = new FileReader();

        reader.onload = (function(file){
                           return function(e){
                                    // do something
                                  }
                        })(file) 
       reader.readAsDataURL(file):
    } else {
        fileDisplayArea.innerHTML = "File not supported!";
    }
});

Reading files in JavaScript using the File APIs

JQuery：从url获取图像元素

1 个答案: