事件 - htmx:validation:halted

当请求由于验证错误而停止时，会触发此事件。

如果包含在 <form> 标签内，则会由 H5 接管校验及处理验证错误的提示。所以 htmx:validation:halted 事件通常用在没有 <form> 标签的表单提交，需要配合 hx-validate = "true" 使用，且必须由 hx-include 等指定要提交的输入控件，同时触发的 <button> 类型不能为 submit。

事件参数

• detail.elt - 触发请求的元素
• detail.errors - 包含无效元素及其相关错误的错误对象数组

不会触发 htmx:validation:halted 事件的示例代码

以下代码带了 <form> 标签，且按钮类型为 submit，所以该代码不会在控制台打印出：Validation halted 。

<form action="/test">
    <input type="text" name="name" required>
    <button type="submit"
    hx-on:htmx:validation:halted="console.log('Validation halted');"
    >Submit</button>
</form>

触发 htmx:validation:halted 事件的示例代码

以下代码就会在用户未输入任何内容的情况下在控制台打印出：Validation halted 。

<input type="text" name="name" required>
<button type="button"
    hx-post="/test"
    hx-validate="true"
    hx-include="[name]"
    hx-on:htmx:validation:halted="console.log('Validation halted');"
>Submit</button>