hx-validate
hx-validate 属性将实现元素在提交请求之前通过HTML5 API 验证进行自我验证，该属性不会被继承。
默认情况下，只有 <form> 元素会验证数据，其他元素则不会。在 <input> 、 <select> 、 <textarea> 中添加 hx-validate="true" 可在发送请求之前启用验证。
启用 hx-validate 后，HTMX 会在发送请求前调用原生 .checkValidity() 方法，如果字段未通过 HTML5 验证（如 required, pattern, type=email 等），请求会被取消，浏览器会自动提示表单验证错误。
示例代码
<body>
<input type="email" name="email" id="email" required>
<input type="url" name="url" id="url" required>
<button hx-post="/test" hx-target="#response" hx-include="#email,#url" hx-validate="true"
hx-on:htmx:validation:halted="validation(event)">Submit</button>
<div id="response"></div>
</body>
<script>
function validation(evt) {
evt.detail.errors.forEach(err => {
console.log(err.elt);
console.log(err.message);
});
}
</script>
以上代码没有加入 <form> 标签，通过 hx-include 指定要提交的表单元素，在 #email 与 #url 元素上都使用了 H5 的语法指定基本校验规则，然后在提交按钮上加入 hx-validate="true"，同时监听 htmx:validation:halted 事件。
用户在未输入任何信息的情况下点击提交，就能看到在控制台打印出错误信息。
注意事项
需要配合 htmx:validation:halted 事件对验证错误时的逻辑进行处理（如：提示用户等），否则你将看不到任何反馈。