Turbo Drive对表单生效但链接不触发AJAX加载的问题咨询

问题根因 #

你遇到的现象核心是Turbo的怪异模式兼容逻辑导致：
你输出的HTML页面缺少<!DOCTYPE html>标准文档声明，浏览器会以怪异模式渲染页面，Turbo 7.x在怪异模式下会默认禁用a标签点击拦截逻辑，仅保留表单提交的拦截能力，就会出现你遇到的表单正常、链接走整页刷新的差异。

解决方法 #

你可以任选一种方案修复：

• 方案1：补全标准HTML声明（推荐）
  在你的cgi-bin/index.sh输出的HTML最开头添加<!DOCTYPE html>，修改后的HTML结构如下：

  <!DOCTYPE html>
  <html>
    <head>
      <title>DEMO</title>
      <script src="/node_modules/@hotwired/turbo/dist/turbo.es2017-umd.js"></script>
    </head>
    <!-- 其余内容不变 -->
  </html>
  

  调整后Turbo会自动进入标准工作模式，自动拦截所有同域a标签的点击事件，走fetch请求更新页面，不会触发整页刷新。
• 方案2：给链接手动加强制属性
  如果你无法修改文档声明，可以单独给需要走Turbo请求的链接添加data-turbo="true"属性：

  <a href="?val=NEW" data-turbo="true">NEW</a>
  

  即可强制Turbo拦截该链接的点击事件，走AJAX请求更新页面。

内容的提问来源于stack exchange，提问作者Alex028502