jQuery / Javascript - получить все загруженные изображения - PullRequest
0 голосов
/ 22 марта 2020

Это код, который я использую для получения всех загруженных изображений:

$("img").on('load', function() {
  console.log('Image Loaded'); 
}).each(function() {
    if(this.complete){
        //$(this).trigger('load'); 
        var img = $(this).attr('src');
        console.log(img);
    } 
});

, но он не работает с теми, которые загружаются с ajax впоследствии, поэтому я попытался:

$(document).on('load', 'img', function(){
  console.log('Image Loaded'); 
}).each(function() {
    if(this.complete){
        //$(this).trigger('load'); 
        var img = $(this).attr('src');
        console.log(img);
    } 
});

но он ничего не делает, что будет правильным? Мне нужно манипулировать родительскими элементами каждого недавно загруженного изображения, поэтому получение только всех периодов изображений при каждой загрузке ajax было бы излишним и не изящным

Ответы [ 3 ]

0 голосов
/ 22 марта 2020

Я предлагаю вам создать функцию для получения изображений, а также вызывать ту же функцию после выполнения ajax.

Редактировать

Передать строку id или class, присутствующую в документе или возвращенную ajax данные, чтобы ограничить область действия функции

function getImages(id) {
    $('#' + id).find("img").on('load', function() {
        console.log('Image Loaded'); 
    }).each(function() {
        if(this.complete) {
            //$(this).trigger('load'); 
            var img = $(this).attr('src');
            console.log(img);
        } 
    });
}

getImages('outsideAjax'); // call during normal execution. outsideAjax is an id within your html document but not in the returned ajax data

$.ajax({
    // ajax settings
}).done(function() {
    // post ajax code
    // append returned data to document
    getImages('insideAjax'); // recall after successful ajax execution and appending of returned data. 'insideAjax' is an id inside your return ajax data 
}).fail(function(jqXHR, textStatus, errorThrown) {
    // report error
});
0 голосов
/ 24 марта 2020

Вот как я решил это:

image

Внутри AJAX ответ.

Я думаю, это само за себя, работает отлично!

В checkPi c функция Я нахожу этот элемент по sr c и получаю родительские элементы и т. Д.

0 голосов
/ 22 марта 2020

Как насчет этого?

$(document).on('load', 'img', function(){
     console.log('Image Loaded');
     var parent = $(this).parent(); //or .parents('div') or .closest('div'), etc..
     //do something with parent
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...