0

对我的问题感到非常沮丧,我完全想在我的网站上添加一个小功能。我真的不知道我在做什么,我正在尝试使用 HTML 输入范围,以及一个标记滑块值的文本框。

所以到目前为止我有这个......

<input id="Slider" type="range" min="0" max="2" value="2" />
<p class="note">Current value: <span id="currentValue">0</span></p>
<script>
  $(function(){

  var currentValue = $('#currentValue');

  $('#Slider').change(function(){
      currentValue.html(this.value);
  });

  $('#Slider').change();

  });
</script>

它工作正常,有时它并不总是更新数字,而是输出数字 0、1 和 2。

我需要知道如何将 0 转换为一个单词,例如...苹果,1 转换为橙色,2 转换为香蕉,或者任何我希望的单词。

感谢您提供任何帮助。另外,如果有更好/更有效的方法来实现这一点,那也很好,谢谢。

4

1 回答 1

1

您将使用一个数组来.html()更改文本(@Ian 如何评论)。滑块的改进版本,单词发生了变化:

HTML

<p id="word">Number 0 has been chosen</p>

<input type="range" id="Slider" type="range" min="0" max="2" value="0">

JS/jQuery

var n = ["Number 0 has been chosen", "Number 1 has been chosen", "Number 2 has been chosen"];

$('#Slider').on('change', function(){
    $('#word').html(n[this.value]);
});

JSFiddle

于 2013-10-09T19:22:36.040 回答