javascript - pushState needs to click back twice -
im new javascript.
im trying create 1 page site.
trying make can store each page faster load if open page again.
problem im having javascript if navigate other pages need click twice go home page, dose not happen time, everytime when trying index.html.
window.onload = function () { // content pages. var partialscache = {}; // references page elements. var navlinks = document.queryselectorall('.load-content'); var contentelement = document.getelementbyid('content'); // update page content. var updatecontent = function(stateobj) { // check make sure state object not null. if (stateobj) { contentelement.innerhtml = stateobj; } }; // load page content via ajax. var loadcontent = function(url, callback) { if(!partialscache[url]){ var request = new xmlhttprequest(); request.onload = function(response) { // save html in pages object doesn't need // loaded again. partialscache[url] = response.target.response; // update title , content. updatecontent(partialscache[url]); // execute callback function. callback(); }; request.open('get', url, true); request.send(); } // update title , content. updatecontent(partialscache[url]); callback(); }; // attach click listeners each of nav links. (var = 0; < navlinks.length; i++) { navlinks[i].addeventlistener('click', function(e) { e.preventdefault(); // fetch page data using url in link. var pageurl = this.attributes['href'].value; loadcontent(pageurl, function() { var pagedata = partialscache[pageurl]; // create new history item. history.pushstate(pagedata, pageurl, ''); }); }); } // gets "active" class on active navigation link. function getactivelink(callback){ callback(navlinks[0].attributes['href'].value); /*for (var = 0; < navlinks.length; i++) { if(navlinks[i].classname.indexof('active') !== -1){ callback(navlinks[i].attributes['href'].value); } }*/ } // update page content when popstate event called. window.addeventlistener('popstate', function(event) { updatecontent(event.state); }); getactivelink(function(active) { // load initial content. loadcontent(active, function() { // update history event state object contains data // homepage. history.replacestate(partialscache[active], active, ''); }); }); };
Comments
Post a Comment