事件 - htmx:timeout

htmx:timeout 是 HTMX 中的一个事件，当发起的请求因为超时而被取消时触发。也就是说，当请求超过设定的时间限制还没响应，HTMX 会中断请求并触发这个事件，方便你做一些超时处理，比如提示用户或重试。它封装了 XMLHttpRequest 事件的 timeout 。

可以使用 htmx.config.timeout 设置超时，也可以使用 hx-request 为元素设置超时时间。

设置请求超时时间（单位毫秒），超过这个时间请求会被中断，触发 htmx:timeout。

事件参数

• detail.elt - 发送请求的元素
• detail.xhr - XMLHttpRequest
• detail.target - 请求的目标
• detail.requestConfig - AJAX请求的配置

示例代码

<button hx-get="/slow-endpoint" hx-timeout="2000" hx-target="#result">
  请求慢接口（超时2秒）
</button>

<div id="result"></div>

<script>
  document.body.addEventListener('htmx:timeout', function(event) {
    console.warn('请求超时！');
    // 你可以访问 event.detail 来获取更多信息
    const detail = event.detail;
    alert('请求超时，请稍后重试');
  });
</script>