Question

我试图将$符号附加到使用Foundation.js框架生成的滑块标签，这里是fiddle，这里是HTML代码：

<div class="row">
    <div class="small-10 medium-11 columns">
         <div class="range-slider" data-slider data-options="display_selector: #sliderOutput3;">
           <span class="range-slider-handle" role="slider" tabindex="0"></span>
             <span class="range-slider-active-segment"></span>
             </div>
         </div>
         <div class="small-2 medium-1 columns">
          <span id="sliderOutput3"></span>
            </div>
      </div>

当前标签由id="sliderOutput3"生成，并使用data-slider data-options="display_selector: #sliderOutput3;"

传递

我已经尝试了几个小时来添加$ symobol到标签，任何帮助将不胜感激

Answer 1

理想情况下，on_change方法可以像这样使用

Text income = new Text();
income.textProperty().bind(Bindings.concat(Available.income.asString()).concat(" Income for ").concat(now.getValue().getMonth().toString()));

但是这不起作用。

从源代码看，它看起来像foundation.js triggers on_change(source)，然后是sets the value(source)到#sliderOutput。这意味着对public static SimpleIntegerProperty income = new SimpleIntegerProperty private ObjectProperty<YearMonth> now = new SimpleObjectProperty<YearMonth>(YearMonth.now());中的#sliderOutput所做的任何操作都将被覆盖。

您有两个选择

选项1

使用$符号另一个范围。喜欢这个

$(document).foundation({
    slider: {
        on_change: function () {
            var value = $('.range-slider').attr('data-slider');
            $('#sliderOutput3').html(value + '$');
        }
    }
}).foundation('joyride', 'start');

这是一个演示 http://jsfiddle.net/dhirajbodicherla/z3h8gzqb/2/

选项2

在on_change方法中使用settimeout，如下所示

on_change

这是一个演示 http://jsfiddle.net/dhirajbodicherla/z3h8gzqb/4/

我个人会推荐选项1.选项2会起作用，但会有延迟，感觉不对。

将文本附加到滑块文本（display_selector）

1 个答案:

选项1

选项2