触发修改器

触发器还可以包含一些额外的修饰符来改变其行为。例如：如果你希望请求仅发生一次，则可以对触发器使用修饰符 once ：

<div hx-post="/mouse_entered" hx-trigger="mouseenter once">
    [Here Mouse, Mouse!]
</div>

可以用于触发器的其他修饰符有：

• changed - 仅当元素的值发生变化时才发出请求
• delay:<time interval> - 等待给定的时间量（例如1s）后再发出请求。如果事件再次触发，则倒计时将重置。
• throttle:<time interval> - 在发出请求之前等待给定的时间（例如 1 秒）。与 delay 不同，如果在达到时间限制之前发生新事件，则事件将被丢弃，因此请求将在时间段结束时触发。
• from:<CSS Selector> - 监听不同元素上的事件。这可以用于键盘快捷键之类的操作。

你可以使用这些属性来实现许多常见的 UX 模式，例如 Active Search：

<input type="text" name="q"
    hx-get="/trigger_delay"
    hx-trigger="keyup changed delay:500ms"
    hx-target="#search-results"
    placeholder="Search..."
>
<div id="search-results"></div>

如果输入已更改，则此输入将在按键事件发生后 500 毫秒发出请求，并将结果插入到 id 为 search-results 的 div 中。 可以在 hx-trigger 属性中指定多个触发器，以逗号分隔。