<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <header> <h1>Ajax jQuery</h1> <nav> <ul> <li><a href="page1.html">Page 1</a></li> <li><a href="page2.html">Page 2</a></li> <li><a href="page3.html">Page 3</a></li> </ul> </nav> </header> <div id="content"> </div> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> <script> $(document).ready(function() { $('nav li a').click(function() { var url = $(this).attr('href'); $.ajax({ url: url, success: function(data){ $('#content').html(data); } }); if(url != window.location){ window.history.pushState(null, null, url); } return false; }); }); </script> </body> </html>

when reloading the page loads only the content of the page, how to make the main page load and add the content of the page we downloaded?

  • And what does the server return? - andreymal
  • As an option, you can add parameter 1-3 in the url, and when you restart the page, you can already check this url and simulate pressing the key you need. - Oleksandr
  • if you copy the url and paste it in a new window, it will open only content without a header, etc. How to solve this problem? - Ivan Hladysh

0