为什么 HTMX 交换在锚标记上失败？

Question

我正在尝试使用 HTMX 库使锚标记更新我网页的一部分。我开始制作我的锚标签。 GET 请求正在执行，但 html 交换失败。不是交换目标元素的内容，而是整个结果显示在视口中。我该如何解决这个问题，以便当我点击我的锚标记时，响应的内容在具有生成器 ID 的元素中交换？

Answer 1

如果您不想执行 boosting request，请删除 hx-boost="true" 属性，并将 href 属性替换为 hx-get。提升请求也会更新浏览器历史记录，也许您的开发环境中的某些东西会干扰它，并将浏览器转发到部分的 URL 端点。

此外 hx-vals 必须是有效的 JSON 字符串（JSON.parse 的输入），使用引号。您还必须在 {{ value }} 两边加上引号：

<a hx-get="{% ... %}"
   hx-target="#generator"
   hx-swap="innerHTML"
   hx-vals='{"report_name": "{{ value }}"}'
> {{ value }}</a>

Why does HTMX swap fail on anchor tag?