3

我只是在学习 Websharper,所以我还是很困惑。

在 Intellifactory 示例网页上,计算器示例的代码似乎使用ButtonWebshaper 提供了一些 GUI 控件,但安装在磁盘上的代码使用其自己的帮助函数来创建如下所示的按钮:

let btn caption action =
  Input [Attr.Type "button"; Attr.Value caption; Attr.Style "width: 30px"]
  |>! OnClick (fun e _ -> action ())

好像 Webshaper 不包含基本的 GUI 控件,所以您必须执行类似的操作才能获得它们(这似乎违背了使用 Websharper 之类的抽象的目的)。

我想要一个带有回调的滑块,只要它的值发生变化就会被调用。如何使用 Websharper 获得一个?

4

1 回答 1

4

您可以使用 JQueryUI 中的滑块:

[<JavaScript>]
override this.Body = 
    let text = Span []
    let slider = Slider.New(SliderConfiguration(min = 0, max = 10, value = 5))
    // typed way to subscribe doesn't work, internally tries to bind handler to 'sliderslide' event
    // per documentation (http://api.jqueryui.com/slider/#event-slide) should be 'slide'
    // slider.OnSlide(fun _ -> text.Text <- string slider.Value ) 
    JQuery.JQuery.Of(slider.Widget).Bind("slide", Func<_, _, _>(fun _ _ -> text.Text <- string slider.Value )).Ignore
    Div [
        Div [ slider ]
        Div [ text ]
    ] :> _
于 2012-11-12T02:15:29.827 回答