将值与dijit / form / Horizo​​ntalSlider中的句柄一起移动

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

我们可以使用Horizo​​ntalRangeSlider附加点，我们可以放置你想要显示的值。

Horizo​​ntalSRangeSlider有两个附加点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