When using image, source and srcset, how to check src loading? (img.src is empty)

Question

I use the picturec element sourceto choose which image to upload. And although I can add a listener load, I can’t understand which image was loaded as an attribute img src srcand property as empty, even if they were loaded!

<picture>
      <source srcset="images/test1.png" media="(min-width: 64em)">
      <source srcset="images/test2.png" media="(max-width: 63.99em)">

      <!-- This will alert an empty string "" -->
      <img srcset="images/test.png" alt="" onload="alert( this.src );">
</picture>

How to determine which image was uploaded?

Answer 1

, , : currentSrc. image.onload . src.

img.onload = function()
{
    //Old browser
    if ( typeof img.currentSrc === "undefined" ) console.log( img.src );

    //Modern browser
    else console.log( img.currentSrc );
}