onClick : msg -> Element.Attribute msg
onDoubleClick : msg -> Element.Attribute msg
onMouseDown : msg -> Element.Attribute msg
onMouseUp : msg -> Element.Attribute msg
onMouseEnter : msg -> Element.Attribute msg
onMouseLeave : msg -> Element.Attribute msg
onMouseMove : msg -> Element.Attribute msg
onFocus : msg -> Element.Attribute msg
onLoseFocus : msg -> Element.Attribute msg
onEnter : msg -> Element.Attribute msg
on : String -> Json.Decode.Decoder msg -> Element.Attribute msg
Create a custom event listener. Normally this will not be necessary, but
you have the power! Here is how onClick
is defined for example:
import Json.Decode as Json
onClick : msg -> Attribute msg
onClick message =
on "click" (Json.succeed message)
The first argument is the event name in the same format as with JavaScript's
addEventListener
function.
The second argument is a JSON decoder. Read more about these here.
When an event occurs, the decoder tries to turn the event object into an Elm
value. If successful, the value is routed to your update
function. In the
case of onClick
we always just succeed with the given message
.
If this is confusing, work through the Elm Architecture Tutorial.
It really does help!