gpt4 book ai didi

haskell - GHCJS-DOM 事件指导

转载 作者:行者123 更新时间:2023-12-03 15:06:25 26 4
gpt4 key购买 nike

我正在尝试了解如何使用 GHCJS-DOM 创建 GUI。我一直在看 hello world 示例 https://github.com/ghcjs/ghcjs-dom-hello ,这是微不足道的。添加新节点很简单。我不能做,也不能从图书馆文档(只有签名)中解决的是添加一些事件。例如,通过鼠标单击将新节点添加到主体。

我希望避免使用像 JQuery 这样的 JS 库,因为我希望通过 GUI 在 GHC (webkit) 和 GHCJS 之间移植。

最终,我希望能够将鼠标事件表达为 FRP 事件,但我会一步一步解决。

如果有人有任何指导,我将不胜感激。我已经使用 haskell 几年了,但这是我第一次尝试 DOM。

最佳答案

您可以从许多地方获取有关 DOM 的信息,包括 mozilla .这是一个为文档正文上的单击事件添加事件处理程序的示例...

module Main (
main
) where

import Control.Applicative ((<$>))
import Control.Monad.Trans (liftIO)
import GHCJS.DOM
(enableInspector, webViewGetDomDocument, runWebGUI)
import GHCJS.DOM.Document (documentGetBody, documentCreateElement)
import GHCJS.DOM.HTMLElement (htmlElementSetInnerHTML, htmlElementSetInnerText)
import GHCJS.DOM.Element (elementOnclick)
import GHCJS.DOM.HTMLParagraphElement
(castToHTMLParagraphElement)
import GHCJS.DOM.Node (nodeAppendChild)
import GHCJS.DOM.EventM (mouseClientXY)

main = runWebGUI $ \ webView -> do
enableInspector webView
Just doc <- webViewGetDomDocument webView
Just body <- documentGetBody doc
htmlElementSetInnerHTML body "<h1>Hello World</h1>"
elementOnclick body $ do
(x, y) <- mouseClientXY
liftIO $ do
Just newParagraph <- fmap castToHTMLParagraphElement <$> documentCreateElement doc "p"
htmlElementSetInnerText newParagraph $ "Click " ++ show (x, y)
nodeAppendChild body (Just newParagraph)
return ()
return ()

关于haskell - GHCJS-DOM 事件指导,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25921144/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com