方法 - htmx.trigger()

主动触发某个指定事件。

参数

  • elt - 触发事件的元素
  • name - 触发事件的名称
  • detail - 事件详情

语法

htmx.trigger(elt, eventName, detail);
// elt 可以是元素对象,也可以是元素的选择器
// detail 中可以通过字典的方式传入自定义的变量及值
htmx.trigger("#tab2", "myEvent", {answer:42});

示例代码

<body>
    <button onclick="t()">Test1</button>
</body>
<script>
    function t() {
        htmx.trigger(document.body, "myEvent", { myVal: "Hello, World!" });
    }
    document.body.addEventListener("myEvent", function(event) {
        console.log("Custom event triggered:", event.detail.myVal);
    });
</script>

在以上示例代码中,通过 addEventListener 给 document.body 绑定了一个自定义事件 myEvent,点击 Test1 按钮时使用 htmx.trigger 主动触发 myEvent 事件,并传入自定义变量 myVal,在自定义事件 myEvent 中通过 event.detail.myVal 读取传入的自定义变量值。