Обновить ранее выгруженный контент ajax

Question

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

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

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

структура такова:

1. /index.php
2. /portfolio/index.php (список миниатюр, ссылки на каждый проект)
3. /portfolio/project.php (собирает соответствующая информация о проекте)

мне нужна кнопка, которая: не отображается, когда в состоянии 1 ссылки на индекс в состоянии 2 И ссылки на портфолио в состоянии 3.

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

//If link containes project.php, show the back button, if not hide it. 
     if(destination.indexOf('project.php')>=0){ 
      $('div.back-button').css({'display':'block'}); 
      $('a.back-button').attr('href', 'portfolio'); 
     } 
     else if(destination.indexOf('portfolio')>=0){ 
      $('div.back-button').css({'display':'block'}); 
      $('a.back-button').attr('href', '/app'); 
     } 
     else{ 
      $('div.back-button').css({'display':'none'}); 
     }; 

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

Например, когда я нажимаю портфолио из индекса, я хочу, чтобы он помнил, что загружено «портфолио», но затем используйте его только как переменную для расположения кнопок, после того как я нажал на проект. Как только проект будет загружен, кнопка возврата затем вернется в портфолио.

Любая помощь в решении этой проблемы будет оценена по достоинству!

Вы можете увидеть, как далеко я получил в http://joeallam.co.uk/app

Answer 1

После загрузки то, что вы хотите сохранить с помощью AJAX, сохраните innerHTML этого элемента в качестве переменной JavaScript. Затем, когда кто-то нажимает BACK, просто верните содержимое этой переменной в тот же DIV, который обычно загружает содержимое AJAX.

var saveThis; 
saveThis = $('#ajaxTarget').html() //save 
$('#ajaxTarget').html(saveThis) // load