Javascript 如何使用HTML5历史记录使“前进”按钮在本例中工作？

在本例中，我们设法使“后退”按钮起作用，但“前进”按钮似乎有问题，当按下“前进”按钮时，

#model

应重新出现，但它没有出现。有什么好办法吗

$（window.bind（'popstate'，function（））{
$（'#model'）.hide（）；
});
$（“.view”）。单击（函数（）{
pushState（null，null，null）；
$（“#模态”）.show（）；
});
#模态{
位置：相对位置；
显示：无；
高度：100px；
宽度：100px；
背景颜色：灰色
}

点击
您可以使用“哈希”而不是“历史”

这是一个
通过将所有
null
推到历史记录上，您不会以任何方式耦合页面的状态/视图。当您沿着堆栈向前移动时，是否也会触发
popstate
事件

大多数人倾向于使用称为“路由”的相对URL（或片段）来解析历史记录/内容，但您也可以使用
pushState
的第一个参数来添加数据-如何在更大范围内管理此机制超出了范围，但简单示例如下：

$（window.bind（'popstate'，function（））{
var state=history.state | |{}；
state.openModal？$（'#model'）.show（）：$（'#model'）.hide（）；
});
$（“.view”）。单击（函数（）{
$（'模态'）.show（）；
pushState（{openModal:true}）；
});

什么是历史。pushState（null，null，null）；做什么？我看不到后退按钮或前进按钮。不清楚您在代码中做什么。
$(window).bind('popstate', function() {
  if(location.hash.indexOf('#modal') != -1)
      $('#modal').show();
  else
    $('#modal').hide();
});

$(".view").click(function(){
  location.hash ='#modal';
  $("#modal").show();
});