javascript - Detect URL change without hash or iteration -

javascript - Detect URL change without hash or iteration -

i have google-instant type thing url alter via history api. problem occurs when users goes 1 query another, hits button, , nil happens. url in address bar changes, that's it. need observe when back/forward button hit, or when url changes, , fire , event. care working in modern browsers, since site accessible modern browsers anyway.

i prefer not utilize iteration since not instant , not simple events. other methods more simple? thanks.

the windows popstate event fires whenever url changed pushstate, , event should utilize alter sites content ajax or whatever you're using, fires on browser / forwards button. in browsers fires on first pageload, you'll need check well.

i don't have time write total fledged native js illustration event handlers , not, here's quick jquery version:

var checkforfirstload = true; $(window).on({ load: function() { checkforfirstload = false; }, popstate:function(e) { if (checkforfirstload) { updatepage(e.originalevent.state!=null ? e.originalevent.state.page : document.location.pathname, true); }else{ checkforfirstload = false; } } }); function updatepage(pageuri, type, switchcontent) { if (!type) { history.pushstate({ page: pageuri }, page, pageuri); } if (switchcontent) { //replace site content etc. } }

now simple example, , there's lot more going on, checking browser support, checking if clicked link has same href current url, recognizing different url's etc. copied project few one thousand lines of code in object literal, you'll have figure out how popstate works , how utilize in own code.

javascript html5 html5-history