Ползунок горизонтального диапазона Dojo с 2 полями ввода

#javascript #dojo #slider #range

#javascript #додзе #ползунок #диапазон #dojo

Вопрос:

Я хотел бы иметь ползунок горизонтального диапазона со значениями, отображаемыми в двух разных полях ввода. В следующем исходном коде, представленном на веб-сайте https://dojotoolkit.org/reference-guide/1.10/dojox/form/RangeSlider.html значения отображаются только в одном поле ввода и разделяются запятой (‘,’) строка

Любая помощь приветствуется.

Комментарии:

1. Пожалуйста, добавьте код непосредственно к вопросу (без использования внешней ссылки), чтобы люди могли лучше понять, чего вы хотите. Я бы также добавил расширенное объяснение того, что (и как) делает codes и чего вы хотите достичь.

Ответ №1:

Свойство value ползунка представляет собой массив, который содержит оба значения. Вам просто нужно заполнить значения в двух разных входных данных вместо одного. как показано ниже

 require(["dojox/form/HorizontalRangeSlider", "dojo/dom", "dojo/domReady!"], function(HorizontalRangeSlider, dojoDom){
  
  var rangeSlider = new HorizontalRangeSlider({
    name: "rangeSlider",
    value: [2,6],
    minimum: -10,
    maximum: 10,
    intermediateChanges: true,
    style: "width:300px;",
    onChange: function(value){
      dojoDom.byId("sliderValueMin").value = value[0];
      dojoDom.byId("sliderValueMax").value = value[1];
    }
  }, "rangeSlider");
  
});  
 <link href="//ajax.googleapis.com/ajax/libs/dojo/1.11.2/dijit/themes/claro/claro.css" rel="stylesheet"/>
<link href="//ajax.googleapis.com/ajax/libs/dojo/1.11.2/dojox/form/resources/RangeSlider.css" rel="stylesheet"/>
<script src="//ajax.googleapis.com/ajax/libs/dojo/1.11.2/dojo/dojo.js"></script>
<body class="claro">
    <div id="rangeSlider"></div>
    <p><input type="text" id="sliderValueMin" /></p>
    <p><input type="text" id="sliderValueMax" /></p>
</body>  

Комментарии:

1. Теперь я пытаюсь задать стиль слайдеру, но, похоже, это не работает.

2. Как я могу установить HorizontalRule и HorizontalRuleLabels? Он показывает только цифры, но без градуированной шкалы.

3. Извините, что я это разглагольствовал.