JQuery каждый и проблема загрузки

Question

У меня есть следующий код

$(function () {
    $.post("fetch_data.php?url="+$('#url').val(), { }, function(response){
        var arrValues = [ "path/to/img1", "path/to/img2", "path/to/img3", "path/to/img4" ]; //output from php
        var img = new Image();
        $.each(arrValues, function( intIndex, objValue ) {
            img.src = objValue;
            img.onload = function() {
            alert('height: ' + img.height + ' width: ' + img.width);
            }
        });
    });
});

Я новичок в javascript / jquery, этот код возвращает только последнюю ("путь / к / img4") высоту / ширину изображения.* Как мне сделать так, чтобы он возвращал все изображение и ширину массива?

Answer 1

Полагаю, вам нужно создать четыре элемента изображения ... вам нужно немного изменить свой код

попробуйте приведенный ниже код,

$(function () {
    $.post("fetch_data.php?url="+$('#url').val(), { }, function(response){
        var arrValues = [ "path/to/img1", "path/to/img2", "path/to/img3", "path/to/img4" ]; //output from php

        $.each(arrValues, function( intIndex, objValue ) {
        var img = new Image(); //creating number of Image Elements equal to arrValues length
            img.src = objValue;
            img.onload = function() {
            alert('height: ' + img.height + ' width: ' + img.width);
            }
        });
    });
});

Answer 2

Поскольку параметр img определен вне вашего цикла, он будет указывать только на последний созданный файл img u.

попытаться объявить img внутри цикла $ .each ...

и замените img на это в предупреждении.