1

サイトで見つけたスライダー コードを使用しています。コードに小さな変更を加えたい場合を除いて、うまく機能します。私はまだJavascriptを学んでいるので、これを行う方法がよくわかりません。

これが私が使用しているコードです。

<div class="demo">

<div class="SliderControl">
    <label for="s1">Slider 1:</label>
    <input type="text" class="SliderText" readonly="readonly" id="s1" name="s1"/>
    <div class="RatingSlider" id="s1Slider"></div> 
</div>

<div class="SliderControl">
    <label for="s2">Slider 2:</label>
    <input type="text" class="SliderText" readonly="readonly" id="s2" name="s2"/>
    <div class="RatingSlider" id="s2Slider"></div> 
</div>
<div class="SliderControl">
    <label for="s3">Slider 3:</label>
    <input type="text" class="SliderText" readonly="readonly" id="s3" name="s3"/>
    <div class="RatingSlider" id="s3Slider"></div> 
</div>
</div>

<script type="text/javascript">
    $('.RatingSlider').each(function(idx, elm) {
            var name = elm.id.replace('Slider', '');
        $('#' + elm.id).slider({
                value: 3,
                min: 0,
                max: 5,
                step: .5,
                slide: function(event, ui) {
                    $('#' + name).val(ui.value);
                }
            });
    });
</script>

現在、入力フォームにはスライダーの現在の値が表示されます。代わりに、Poor、Fair、Average などを表示するようにします。例: スライダーの値が 3 の場合、入力ボックスのテキストを Fair にします。配列を使用してから値を渡す必要があると思いますが、それを行う方法がわかりません。誰かが私を正しい方向に向けることができれば幸いです。ありがとう

4

0 に答える 0