Javascript:如何获取此图像数据

标签 javascript jquery html

如何获取图像的这些值,尤其是拖动图像时从控制台显示的名称、大小、类型。并将这些数据显示到我的特定 div

 File {name: "free-windows-10-wallpaper_050549897_263.jpg", lastModified:    
 1464238729860, lastModifiedDate: Thu May 26 2016 12:58:49 GMT+0800 (Malay 
 Peninsula Standard Time), webkitRelativePath: "", size: 1185535…}
 lastModified : 1464238729860
 lastModifiedDate :Thu May 26 2016 12:58:49 GMT+0800 (Malay Peninsula Standard Time) 
 name : "free-windows-10-wallpaper_050549897_263.jpg"
 size : 1185535
 type : "image/jpeg"
 webkitRelativePath : ""
 __proto__ : File

这是js代码。

var obj = $('.drag_me');

obj.on('dragover', function(e){
    e.stopPropagation();
    e.preventDefault();
    $(this).css('border', '2px solid #39ADCD');

});

obj.on('drop', function(e){
    e.stopPropagation();
    e.preventDefault();
    $(this).css('border', '2px dotted #39ADCD');

    var files = e.originalEvent.dataTransfer.files;
    var file = files[0]; //<-- I need to get the size, name, image type of this image
    console.log(file);

   //upload(file);
});

这样我就可以将这些数据显示到我的 html 中

<div class="drag_here">
    <div class="drag_me">
        <center id="center_html">
            Drag image here
         </center>
    </div>
</div>

最佳答案

您可以使用以下方式访问它:

file.name, 
file.lastModified

注意:您需要将其包含在 //upload(file) 语句之前。

HTH

关于Javascript:如何获取此图像数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39042125/

相关文章:

javascript - 自动更新 Dropdrop 列表和值

javascript - 如何将行号插入到 ajax 函数中?

javascript - JS在span中查找id

javascript - 使用 Google Analytics 跟踪出站链接时发送额外的字符串

javascript - 谷歌地图有多个位置

javascript - 如何在 Node.JS 中接收 req.body.model 的整个对象而不是单独接收它的所有变量?

html - css 值的限制(左 : - 17000000px; )

html - 通过 json 并在 View 中显示数据的正确语法是什么 - Rails 5?

javascript - 灯箱不起作用,尽管加载了 jquery

javascript - 视觉 : Displaying nested data in a table