php - Ajax load dynamic page -

html index.php

<a class="cart-icon" href="cart"></a> <div class="content"></div> 

ajax load content load-content/cart.php

$(document).ready(function(){    $(document).on('click', '.cart-icon', function(e){        e.preventdefault();        var page = $(this).attr("href");        $('.content').load('load-content/'+page+'.php');    }); }); 

this code load content cart.php not update url when refresh page content in div dissapear. want when refresh page not dissapear , update url.

for example: default url: index.php , when press tag load content cart.php , update url index.php/load-content/cart.php

you need persistent storage of some kind. load dom of page temporary. might same thing you're doing here on document load:

$(document).ready(function(){    $('.content').load('load-content/'+page+'.php');    $(document).on('click', '.cart-icon', function(e){        e.preventdefault();        var page = $(this).attr("href");        $('.content').load('load-content/'+page+'.php');    }); });