javascript - jQuery 单击跳转到 Safari 上的页面顶部

Question

我正在尝试创建一个页脚，基本上当您单击一个链接时，它会打开一个绘制样式效果以显示更多链接。我在单击链接时遇到的问题是它跳转到 Safari 中的页面顶部(在 iPhone 和 iPad 上测试过)(Chrome 工作正常)。

我在 jQuery 中添加了以下内容:

jQuery('#click').click(function(event){
    event.preventDefault();
    // Do something
    return false;
});

但这并没有解决问题。

完整代码在codepen:https://codepen.io/tcfmark/pen/VxWxxa

更新:它在 iOS 7 上的 Safari 中的 iPad 2 上运行正常，但在使用 Safari 或 Chrome iOS 11 的 iPhone 上运行不正常？

如果有人可以看看我哪里出错了，那将会很有帮助。

Answer 1

撇开 javascript，如何使用新的 details/summary 元素。

*{
  box-sizing: border-box;
}

details{
  text-align: center;
}

details div{
  display: flex;
  
}

details div > div{
  flex: 1;
  padding: 10px;
  border: 1px solid #eee;
}

<details>
  <summary></summary>
  <div>
    <div>1</div>
    <div>2</div>
    <div>3</div>
    <div>4</div>
  </div>
</details>