2014-05-02 8 views
10

geschieht I-Seite, die das Routing auf Clientside tut, mit Geschichte API & Push/popstate. Was bei allen modernen Browsern gut funktioniert. (Suchmaschinen werden von node.js prerenderer unterstützt)IE Brennen popstate nicht, wenn hashchange

Allerdings stieß ich vor kurzem auf Problem, wo IE popstate auf Hashchange während nicht feuert, während Pushstate mit URLs funktioniert gut, einschließlich IE11.

Zum Beispiel wie so ...

$(document).on('click', 'a', function(e) { 
    e.preventDefault(); 
    History.pushState({}, '', $(this).attr('href')); 
}); 

... die richtig feuert ...

$(window).on('popstate', function() { 
    console.log('url changed'); 
}); 

der W3C-Spezifikation Nach sollte die hashchange Feuer popstate wie es die aktuelle ändert sich Geschichte. Wenn ich jedoch Hash-Links (<a href="#hashchange">...) hinzufüge und auf IE klicke, wird nichts ausgelöst. :/

würde ich nicht wollen IE Erkennung tun (wie es heutzutage so viele Browser gibt, die in die gleiche Grube des Verderbens fallen könnte), sondern als Feature-Detektion. Doch wie die Geschichte (popstate/pushstate) funktioniert gut, den Rest der Art und Weise kann ich nicht einmal das Problem auf fehlende Push/popstate erkennen ...

if(!window.history || !window.history.pushState) { ... 

... und verwenden Sie die hashchange statt. :/

Irgendwelche Gedanken?

PS. Als Bonus bläst die Verwendung von jquery.history.js (jquery-Wrapped-Version von history.js) mit Hashtag-URL das ganze auf.

http://localhost/routetest/index.html#/page1/1234 

wird

http://localhost/page1/1234 

... ??? :/

+0

Welche Version von IE an Ihnen spähen? Es scheint ein Problem mit 'pushState()' für IE 9 zu geben. Sehen Sie sich diese Frage mit der angegebenen Antwort an: http: // stackoverflow.com/questions/3722815/does-internet-explorer-support-pushstate-und-replacestate – urbz

+1

Ah, tut mir leid. IE11. Gerade erwähnte moderne Browser aber gescheitert auf der IE-Version :) – crappish

Antwort

1

Dies ist ein bekanntes Problem in IE11 und alle Internet Explorer-Browser vor Rand verwenden.

Siehe diesen Link https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/3740423/. Die Microsoft-Antwort ist der letzte Post in diesem Problembericht und notiert die neueste Version, die funktioniert.

Alle Versionen von IE wird dieses Verhalten anzuzeigen, und Hacking/Affe-Patchen das richtige Verhalten wieder in den Veranstaltungsrahmen ist wahrscheinlich der einzige Weg, um es zuverlässig zu arbeiten. Dies bedeutet, dass Sie wahrscheinlich eine IE-spezifische Logik benötigen, wenn Sie sie selbst implementieren möchten.

0

In IE 10 und 11 das popstate Ereignis wird nur für eine Geschichte Artikel gebrannt wird, nachdem der Staat mit history.pushState oder replaceState eingestellt wurde, einschließlich, wenn es auf null gesetzt wird, und nur dann, wenn zwischen zwei Elementen durchlaufen, die haben hatte Staat gesetzt. Daher ist es erforderlich, den Status für ein neues History-Element im Hashwechselereignis festzulegen. Sobald der Status festgelegt ist, wird das Popstate-Ereignis ausgelöst, wenn der Benutzer durch den Browserverlauf navigiert.

https://developer.mozilla.org/en-US/docs/Web/API/History