在IE中仿真/填充history.pushstate（）
history.pushstate()在IE中不受支持。 有没有另一种方式来实现这一点在IE浏览器？
考虑使用或适应GitHub中的History.js 。 根据描述：
History.js在所有浏览器中优雅地支持HTML5历史/状态API（pushState，replaceState，onPopState）。 包括继续支持数据，标题，replaceState。 支持jQuery，MooTools和Prototype。 对于HTML5浏览器来说，这意味着您可以直接修改url，而无需再使用哈希值。 对于HTML4浏览器，它将恢复使用旧的onhashchangefunction。
IE（upto和包括9），不支持pushstate（）。 IE 10支持它。
考虑将历史API用于不受支持的浏览器，或者在https://github.com/devote/HTML5-History-API上查看库;
这个Javascript库提供了对旧版浏览器的HTML5历史API的模拟。
该库按照W3C规范运行，不添加任何新的或不兼容的方法。 该库可以完全按照描述使用，例如，在Dive Into HTML5 book http://diveintohtml5.info/history.html或历史API规范http://www.w3.org/TR/html5/history中。; html＃the-history-interface 。
在纯JS的上下文中使用库的例子：
<!DOCTYPE html> <html> <head> <script type="text/javascript" src="history-2.0.4.js"></script> <script type="text/javascript"> window.onload = function() { // function for the reference is processed // when you click on the link function handlerAnchors() { // keep the link in the browser history history.pushState( null, null, this.href ); // here can cause data loading, etc. // do not give a default action return false; } // looking for all the links var anchors = document.getElementsByTagName( 'a' ); // hang on the event, all references in this document for( var i = 0; i < anchors.length; i++ ) { anchors[ i ].onclick = handlerAnchors; } // hang on popstate event triggered // by pressing back/forward in browser window.onpopstate = function( e ) { // we get a normal Location object /* * Note, this is the only difference when using this library, * because the object document.location cannot be overriden, so * library the returns generated "location" object within an * object window.history, so get it out of "history.location". * For browsers supporting "history.pushState" get generated * object "location" with the usual "document.location". */ var returnLocation = history.location || document.location; // here can cause data loading, etc. // just post alert( "We returned to the page with a link: " + returnLocation.href ); } } </script> </head> <body> <a href="/mylink.html">My Link</a> <a href="/otherlink.html">Other Link</a> </body> </html>
与JQuery一起使用库的示例：
<!DOCTYPE html> <html> <head> <script type="text/javascript" src="history-2.0.4.js"></script> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> $(function() { // looking for all the links and hang on the event, // all references in this document $("a").click(function() { // keep the link in the browser history history.pushState( null, null, this.href ); // here can cause data loading, etc. // do not give a default action return false; }); // hang on popstate event triggered // by pressing back/forward in browser $( window ).bind( "popstate", function( e ) { // we get a normal Location object /* * Note, this is the only difference when using this library, * because the object document.location cannot be overriden, so * library the returns generated "location" object within an * object window.history, so get it out of "history.location". * For browsers supporting "history.pushState" get generated * object "location" with the usual "document.location". */ var returnLocation = history.location || document.location; // here can cause data loading, etc. // just post alert( "We returned to the page with a link: " + returnLocation.href ); }); }); </script> </head> <body> <a href="/mylink.html">My Link</a> <a href="/otherlink.html">Other Link</a> </body> </html>
