在 dijit/form/HorizontalSlider 中移动值和句柄

Question

目前我在滑动时获取值，但我想在 dojo 水平滑块中显示这些值和手柄。我正在像这样创建滑块

    var slider = new HorizontalRangeSlider({
                name : "slider",
                value : startValue,
                //starting and end values to the slider             
                minimum : endValue,
                maximum : endValue,
                intermediateChanges : true,
                showButtons : false,
                onChange : lang.hitch(this, "setValues")
            }, this.slider).startup();

    var sliderLabelsRule = new HorizontalRule({
                container : "topDecoration",
                style:"height:5px",
                count : 2,              
                numericMargin: 1
            }, this.sliderRule);
            this.sliderLabelsRule.startup();

            //create the labels object
    var sliderLabelsTop = new HorizontalRuleLabels({
                container : "topDecoration",
                style : "font-size: 14px;",
            //array that contains the label values
                labels : array,
            }, this.sliderLabelsTop);
            sliderLabelsTop.startup();

模板是这样的

<div>
    <div data-dojo-attach-point="slider">

        <div data-dojo-attach-point="sliderRule"></div>

        <ol data-dojo-attach-point="sliderLabelsTop"></ol>
    </div>
</div>

现在我必须在滑块手柄正下方滑动滑块规则时显示值，如何在 dojo 中执行此操作？

Answer 1

我们可以利用 HorizontalRangeSlider 附加点，我们可以将您想要显示的值放在那里。

HorizontalSRangeSlider 有两个附加点 sliderHandle 和 sliderHandleMax，我们可以这样放置值，

                this.horizontalSlider = new HorizontalRangeSlider({
                name : "slider",
                value : this.sliderMinMax,
                minimum : this.sliderMinMax[0],
                maximum : this.sliderMinMax[1],
                intermediateChanges : false,
                showButtons : false,
                onChange : lang.hitch(this, "callOnchange")
            }, this.slider);
            this.horizontalSlider.startup();

            this.horizontalSliderRule = new HorizontalRule({
                container : "topDecoration",
                style:"height:5px",
                count : 2,              
                numericMargin: 1
            }, this.sliderRule);
            this.horizontalSliderRule.startup();

this.horizontalSliderRule.sliderHandle.innerHTML = value //your value to show

在 dijit/form/HorizontalSlider 中移动值和句柄

Move the value along with the handle in dijit/form/HorizontalSlider

dojo