1、使用pushState(data, title, url)将url加入到堆栈中,data为要给state的数据,title页面标题可为空,url是要加入的
2、replaceState(data, title, url)和上一个参数相同,不同点在于他是改变当前的url,且不会让state.length加一
2、当后退时,调用onpopstate()函数,返回前一个url
3、具体实现
(1)在ajax中,
var num = Math.random().toString().replace('.', '%'); $('#project').change(function() { $.post("{{ url('project') }}/"+$('#project').val(), {'_token': '{{ csrf_token() }}'}, function(data) { $('#body').html(data); window.history.pushState(data, '', "{{ Url('index') }}"+"?page="+num); // 将url加入堆栈 }); });
(2)当后退时,自动会调用onpopstate()函数,当history.back(),go()都会调用
window.addEventListener('popstate', function(event) { // 点后退时 var state = event.state; // 得到上个url的页面数据 location.href = "{{ url('index') }}"+"?page="+state; $('#body').html(state); // 再次改变内容 });