将Ajax添加到任何网站从未如此简单。 实际上, 基于称为单页应用程序(或SPA )的 Ajax请求构建整个网站是很普遍的。
但是,这始终需要一些jQuery和一些技术上的争论才能更新页面内容 。 如果您只需要一些基本的Ajax功能 ,则可以使用intercooler.js将此功能混合到HTML中。
Intercooler使您可以编写HTML属性,这些属性本机包含Ajax请求URL 。 当用户单击某些链接时,您可以指示运行Ajax请求,而不是正常的单击操作。
所有这些都依赖于HTML5 data- *属性,例如ic-post-to
。 您可以将此属性添加到按钮或锚链接,然后它将自动连接到jQuery以进行Ajax POST请求。
插件网站上实际上有一个充满这些属性的页面。 下面是一些示例代码,以查看其外观:
<a ic-post-to="/button_click">Click Me!</a>
这会将Ajax POST请求发送到URL /buton_click
,并将响应加载到容器元素中。 Intercooler是一个非常简单的库,一旦您了解了它的工作原理,它的功能就会异常强大。
授予它不能解决您所有的Ajax问题,因为它不能自动更新页面的其他区域 。 它也不能在不减慢页面速度的情况下附加太多自定义功能 ,因此详细的SPA应该确实使用自定义Ajax代码 。
Intercooler.js提供了一种更加语义化的方式来编写Ajax代码,以便其加载甚至提供本机回退。
要安装中冷器,您只需要一个jQuery 副本以及可在GitHub上找到的中冷器库的副本 。 您甚至可以使用jQuery CDN和本地Intercooler CDN进行 测试,而无需下载任何文件。
将两者都放入页面标题中的<script>
标记中 ,然后将HTML属性放置在任意位置!
快看一下演示页面 ,查看可以使用的演示的完整列表 。 我特别喜欢“单击以编辑”演示,因为该演示准确显示了该插件可能实现的功能以及可以使用的距离。
![中冷器演示](https://i-blog.csdnimg.cn/blog_migrate/0a50d4e4c57faacd1498114b699b6150.png)
如果您想了解更多信息,请查阅完整的中间冷却器HTML属性参考指南 。 每个人都执行不同的操作,因此至关重要的是对它们全部进行研究,并确定最适合您的方案的情况。
自然,您可以在GitHub上免费找到所有源代码以及简短的安装指南 。