0

我发现了这个有趣的结合示例htmx：sweetalert2https: //htmx.org/examples/confirm/

我尝试了一下让它启动并运行，bootbox.js但我没有得到任何回复：

<a class="pointer" hx-delete="/delete/"
   hx-trigger="confirmed"
   _="on click
      call bootbox.confirm({message: 'Do you want to delete it?'})'
      if result trigger confirmed">
   Delete object
</a>

知道我可能做错了什么吗？

谢谢！

4

1 回答 1

1

不幸的是， bootbox.js不适用于您尝试使用的超脚本语法。在原始示例中，HTMX/hyperscript 使用Sweetaler2库，它返回一个对象，其中超脚本可以检查isConfirmed属性并触发相应的事件。但是 bootbox.js 的行为不是这样，它还需要一个回调函数。

但是，如果您不介意旧的、冗长的 jQuery 方法（bootbox.js 使用它），我们可以通过在 bootbox.js 的回调函数中手动触发相应的 HTMX 事件来使其工作：

<a class="pointer" id="confirmbutton" hx-delete="/delete/" hx-trigger="confirmed">
  Delete object
</a>

<script>
$(document).ready(
  $("#confirmbutton").click(function(){
    bootbox.confirm({message: 'Do you want to delete it?',
                     callback: function(ok) {
                       if (ok) {htmx.trigger(htmx.find("#confirmbutton"), "confirmed")}
                    }})
  })
)
</script>

如果用户单击确认按钮，bootbox.js 会true以变量形式返回，因此我们可以触发相应的事件。ok

于 2022-01-28T09:02:48.883 回答