对于每个 LOOP 通过 JSON.Stringify 图像的 EXIF 数据

Question

我有一张图片，一旦我点击它，它就会显示得更大，旁边有 EXIF 数据。我正在使用 JSON.strigify 获取 EXIF 数据，然后我需要显示该字符串中的任何内容，以便在我的 HTML 中添加到<span>标签id='makeAndModel'中。

我想对每个箭头函数都这样做，但我不确定具体如何。

   `<div id="imageContainer"></div>

      <div id="myModal" class="modal">

        <span class="close">&times;</span>

        <img class="modal-content" id="current">

        <pre>Make and model: <span id="makeAndModel"></span></pre>

    </div>`

   <--Taking the src attribute and creating the images-->

    let $modal = $('.modal')

    let $img = $("#imageContainer img");

      $img.click(function(){

        $('.modal-content').attr('src', $(this).attr('src'));

        $modal.css('display', 'block')

      <--EXIF data-->

       var imgCurrent = document.getElementById('current');

       EXIF.getData(imgCurrent,function(){

         let result = $('#makeAndModel')

         let make= JSON.stringify(EXIF.getAllTags(this));

    });

    let $makeAndModel = $('#makeAndModel');

    $makeAndModel.text(`${make}`)

  })

`

当前在控制台中的输出let make是对象

let make = {

    "Orientation":1,

    "YCbCrPositioning":1,

    "XResolution":72,

    "YResolution":72,

    "ResolutionUnit":2,

    "Make":"samsung",

    "Model":"SM-G965F",

    "Software":"G965FXXU2CSB9",

    "DateTime":"2019:03:18 18:29:28",

    "ExifIFDPointer":213,

    "GPSInfoIFDPointer":833,

    "ExposureTime":0.02,

    "FNumber":2.4,

    "ExposureProgram":"Normal program"

    ,"ISOSpeedRatings":160,

    "ExifVersion":"0220",

    "DateTimeOriginal":"2019:03:18 18:29:28",

    "DateTimeDigitized":"2019:03:18 18:29:28",

}

预期的输出应该是这样的 Make and Model : 

Orientation:1, 

YCbCrPositioning:1, 

XResolution:72, 

YResolution:72,

等等，例如当您单击图像的“属性”->“详细信息”选项卡时

Answer 1

像这样的东西可以工作let $modal = $('.modal')let $img = $("#imageContainer img");$img.click(function() {&nbsp; $('.modal-content').attr('src', $(this).attr('src'));&nbsp; $modal.css('display', 'block')&nbsp; var imgCurrent = document.getElementById('current');&nbsp; EXIF.getData(imgCurrent, function() {&nbsp; &nbsp; let result = $('#makeAndModel')&nbsp; &nbsp; let make = EXIF.getAllTags(this);&nbsp; &nbsp; let props = Object.entries(make).map(([property, value]) => {&nbsp; &nbsp; &nbsp; return `${property}: ${value}`;&nbsp; &nbsp; });&nbsp; &nbsp; result.text(props.join('\n'));&nbsp; });})