即使使用后退按钮（Squarespace），也要加载jQuery点击事件

Question

我正在尝试在FAQ页面上隐藏和显示段落。这些段落最初是隐藏的，我添加以下代码：

  $(document).ready(function() {
    $('h3').click(function() {$(this).next("p").toggleClass("unhidden-paragraph") } )
  })

unhidden-paragraph为其设置样式以显示该段落。因此，如果点击一个问题（h3），就会显示该段落。

这很好用，但是当我转到Squarespace上的其他页面，然后使用“后退”按钮进入“ FAQ”页面时。然后，不会再次调用ready，并且单击h3问题将不再起作用。

Answer 1

即使用户从后退按钮进入页面，也要执行一些jQuery设置代码，可以使用$(window).on('pageshow')代替$(document).ready()：

$(window).on('pageshow', function(){
    $('h3').click(function() {$(this).next("p").toggleClass("unhidden-paragraph") } );
});

---

对于“单页”设计（即正方形空间），您可能只需要将方法直接附加到HTML元素的onclick属性即可：

<h3 onclick='$(this).next("p").toggleClass("unhidden-paragraph");'>Title</h3>