Загрузить изображение по клику с AJAX (jQuery)

Question

У меня есть мобильный сайт со всем контентом на одной странице PHP, и страницы (или, скорее, div) меняются местами с помощью jQuery.Я хочу ускорить время загрузки, и большая часть того, что должно быть загружено, это изображения на био каждого человека.Я хотел бы использовать jQuery для загрузки изображения людей только при переходе к их биографии.Я предполагаю, что мне нужно использовать AJAX, потому что мы не можем полагаться на обновление страницы.Есть указатели?Спасибо!

Answer 1

вы можете использовать загрузку jquery, чтобы загрузить изображение после того, как dom будет завершен, чтобы загрузить

$(function(){
   $("#imgUser").load("images/testimg.jpg");  
});

Answer 2

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

В этом случае вы можете сделать что-то вроде этого:

HTML

<div class="gif-container">
    <a class="load-gif" href="https://media.giphy.com/media/TGHXd9J6mK6sM/giphy.gif">Load GIF</a>
</div>

JS (с использованием jquery):

$('.load-gif').click(function(e) {
  e.preventDefault();
  var gif_url = $(this).attr('href'),
    $gif_image = $('<img>').attr('src', gif_url),
    $container = $(this).closest('.gif-container'),
    $trigger = $(this);
  $gif_image.load(function() {
    $trigger.remove();
    $container.append($gif_image);
  });
});

Полная скрипка: https://jsfiddle.net/ryyoLgzz/