JQuery Ajax открыть страницу ссылки на другую страницу

Question

Я в создало три скрипок для легко понять:

index.html - Index Fiddle

helpFiles.html - Help Fiddle

products.html - Products

в Index.html When я нажимаю ссылку Products read more, она должна открыть страницу helpFiles.html (изначально helpFiles.html не содержит данных с основным div с идентификатором «#helpFiles») с Products.html содержание страницы должно вставляться в #helpFiles div.

Просьба помочь мне с образцом кода и извините за мой английский.

Answer 1

Попробуйте LocalStorage

Объект LocalStorage хранит данные без даты истечения срока действия. Данные не будут удалены при закрытии браузера и будут доступны на следующий день, неделю или год.

В вашем index.html вы могли бы заменить вашу

<a href="HelpFiles.html" class="readMore">Read more...</a> 

с

<a href="HelpFiles.html?page=products" class="readMore">Read more...</a> 

Добавьте этот сценарий в верхней части этой страницы

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> 
<script> 
$(document).ready(function(){ 
    $(".itemContent .readMore").click(function(){ 
     var imgName = $(this).parent().parent().find("img").attr("src"); 
     url = $(this).attr("href"); //Gets the url from the anchor tag clicked 
     var page = url.split("?page="); 
     localStorage.setItem("pageName", page[1]); 
     localStorage.setItem("imageName", imgName); 
    }); 
}); 
</script> 

В ваших файлы справки .html Вы должны добавить следующий скрипт на верхних

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> 
<script> 
    $(document).ready(function(){ 
     var pageName = localStorage.getItem("pageName"); 
     var imagepath =localStorage.getItem("imageName"); 
     $("#helpFiles").load(pageName+".html"); 
}); 
</script> 

Надеется, что это может дать вам идею родственное .. :)

FYI

localStorage

load()