jQuery:加载具有ajax，缓存，干净URL和后退按钮支持的页面

jQuery: load pages with ajax, caching, clean URLs and back button support

本文关键字：按钮 支持 干净 加载 ajax jQuery 缓存 URL      更新时间：2023-09-26

我正在建立一个有 5 页的网站。有些页面内容非常繁重(100+图像(，有些页面非常轻量级(几段文本(。

我正在寻找一个jQuery解决方案(也许有一个插件？(，它使用jQuery的.ajax((方法在用户单击导航时加载新页面。准确地说：

  • 单击时，页面内容淡出
  • 加载后，所需页面的内容将淡入
  • 浏览器栏使用干净的 URL 进行更新
  • 保留后退按钮功能
    • 缓存第一页
  • 的内容，以便在用户导航回来时快速显示第一页的 HTML、JS 和图像。 即不需要新的 ajax 调用。我知道jQuery的.ajax((支持缓存，当你使用本视频中所述的Promise功能时(大约11：00(

这是我到目前为止所拥有的：

我

找到了Ajaxify，一个脚本集合，应该或多或少地完成我的目标。不过，我不确定它是否是一个强大的解决方案并支持缓存和干净的 URL。有人有这方面的经验吗？

我有一个带有此标记的起始页(索引.php(和另一个页面(信息.php(：

<nav class="nav-1">
    <ul>
        <li><a href="index.php">Index</a></li>
        <li><a href="info.php">Info</a></li>
    </ul>
</nav>
<div class="page">
    <p>This is the content area. Its content is to be replaced via Ajax.</p>    
</div>

更新：添加了有关项目状态的更多详细信息

尝试涡轮链接或 pjax。

https://github.com/rails/turbolinks/

http://pjax.heroku.com

唯一缺少的部分是淡入/淡出回调，可以插入其中任何一个的侦听事件。

相关文章：