一种检测除特定控件以外的任何地方的点击的方法？

Question

在我的应用程序中，用户可以单击 div 以突出显示它。有没有办法检测到他们点击了远离 div 的某个地方？当发生这种情况时，我想取消突出显示 selected 的东西。我尝试向包含其他所有内容的大 div 添加一个 onclick，但这并没有真正按预期工作。 IIRC 大 div onclick 总是在包含的 div onclick 之后发生，所以你不能 select 任何东西。

Answer 1

您可以通过向 div 添加 on "click" 事件，然后在内部 div 中添加 on "click" 事件来完成此操作，使用 onWithOptions 停止传播事件。这是一些（未经测试的）代码：

onClickStop msg =
    onWithOptions "click"
        { stopPropagation = True, preventDefault = False }
        (Json.succeed msg)


view _ =
    div [ onClick Clicked ]
        [ div [ onClickStop NoOp ] []
        ]

当用户在嵌套的 div 中单击时，该事件将被忽略，并且它向其父级的传播将被取消。只有当用户在内部 div 之外单击时，Clicked 消息才会发送到 update。

一种检测除特定控件以外的任何地方的点击的方法？

A way to detect a click anywhere but a specific control?

elm