javascript - 如何避免在popstate事件处理程序中调用history.pushState？

假设我们有一个<p:commandLink action="…" onclick="history.pushState(…)">对页面状态进行重要更改。 Primefaces 5.1生成以下HTML：<a id="link1" href="#" onclick="history.pushState( {currentStateKeyWord: 'state1'},'','state1'); PrimeFacesGeneratedFunction(stuff);">Click me for state 1</a><a id="link2" href="#" onclick="history.pushState( {currentStateKeyWord: 'state2'},'','state2'); PrimeFacesGeneratedFunction(stuff);">Click me for state 2</a>在popstate事件处理程序中，我们必须根据作为pushState中第一个参数推送的对象恢复状态。使用JQuery：jQuery(document).ready(function(jQuery) { jQuery(window).bind('popstate', function(event) { if ((event.originalEvent.state!==null) && (event.originalEvent.state.currentStateKeyWord!==undefined)) { switch (event.originalEvent.state.currentStateKeyWord) { case 'state1': jQuery("#link1").click(); break; case 'state2': jQuery("#link2").click(); break; default: console.error("Unknown state"); } } }}为什么这样不起作用：使用jQuery("#link1").click();会强制链接完全按用户单击链接的方式工作，这会很好，但是不幸的是，popstate事件处理程序不得调用history.pushState（位于）。在Firefox中，此代码中断了“前进”按钮，这是不可取的。问题：考虑到我们所做的任何事情，onclick必须触发对history.pushState的调用，将最正确地编写对popstate的调用和popstate事件处理程序的最简单方法是什么？谢谢！ 最佳答案 昨天，我以为解决方案将在客户端，并且像往常一样，我今天早晨醒来时的想法完全不同。我原来的JSF代码是：<p:commandLink action="#{associateBean.setState('state1')}" onclick="history.pushState('{currentStateKeyWord: 'state1'}','','state1')" update="somePanel"/><p:commandLink action="#{associateBean.setState('state2')}" onclick="history.pushState('{currentStateKeyWord: 'state2'}','','state2')" update="somePanel"/>如上所述，问题是Primefaces会生成HTML锚点（a）并使用onclick属性来调用我自己的onclick代码（history.pushState）以及与属性（action）。解决方案不是调整JavaScript，而是使用PrimefacesGeneratedFunction('stuff')将<p:remoteCommand>内容移出action。新的JSF代码是：<p:remoteCommand name="setState1" actionListener="#{associateBean.setState('state1')}" update="somePanel"/><p:commandLink onclick="setState1(); history.pushState('{currentStateKeyWord: 'state1'}','','state1')"/><p:remoteCommand name="setState2" actionListener="#{associateBean.setState('state2')}" update="somePanel"/><p:commandLink onclick="setState2(); history.pushState('{currentStateKeyWord: 'state2'}','','state2')"/>现在，commandLink事件处理程序引用了popstate属性，而不是在原始链接上调用<p:remoteCommand name>：jQuery(document).ready(function(jQuery) { jQuery(window).bind('popstate', function(event) { if ((event.originalEvent.state!==null) && (event.originalEvent.state.currentStateKeyWord!==undefined)) { switch (event.originalEvent.state.currentStateKeyWord) { case 'state1': setState1(); break; case 'state2': setState2(); break; default: console.error("Unknown state"); } } }}希望这会帮助某人。