gpt4 book ai didi

javascript - 深度链接无限滚动页面

转载 作者:塔克拉玛干 更新时间:2023-11-02 21:47:18 24 4
gpt4 key购买 nike

我正在创建一个无限滚动的页面,它递归地加载下一页的内容并将其附加到当前页面。我认为浏览体验可以很棒且身临其境,但目前的方法并非没有可用性缺陷。

不完全渐进增强。支持后退按钮并在使用 Ajax 时提供深度链接总是好的。无限滚动的当前实现不支持这一点。无法为状态添加书签。

改进无限滚动用户体验的一些想法。需要意见。

  1. 在每次加载时更改 URL 散列,例如/!#/2 ->/!#/3
  2. 点击后退按钮应该向上滚动页面。点击前进按钮应向下滚动。
  3. 访问深层链接的行为应该与使用 Ajax 之前一样。转到并从第 3 页开始应该只显示第 3 页的内容,而不是第 2 页和第 1 页的内容,因为用户没有要求它们。
  4. 应该仍然有办法让他转到第 2 页和第 1 页,就像是常规分页一样。由于第 3 页加载时 scrollTop 为 0,因此向上滚动事件没有用。为此,我们可能仍然需要一个可点击的链接。
  5. 我们需要检查请求的页码是否大于当前页码,因为我们不应该在第 3 页末尾加载第 2 页的内容。

大家怎么看?

最佳答案

有趣的问题。我建议以 #!/from/123/to/456 的形式更改 URL 哈希,并在页面加载时增加 to id。

无论您是使用哈希或历史 API 重写来修改 URL,在 UX 意义上,URL 始终代表当前内容的位置。例如,用户会期待一个书签、点击重新加载或将 URL 复制到其他计算机并单击“开始”,将返回相同的页面。

让你的无限滚动页面完成 URL 逻辑的唯一方法是我上面建议的 URL 散列。否则就离开它; Twitter 不会更新其主页上的 URL 哈希值。

关于javascript - 深度链接无限滚动页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4273696/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com