如何使用html5和javascript创建变量步骤

Question

我正在使用html5和javascript。我想将范围0到200000分成不同的部分，比如说4，每个部分都有不同的步长。我发现了这个。但没有找到如何获得可变步长

<input 
    id="slide" 
    type="range" 
    min="0" 
    max="200000" 
    step="1" 
    value="100000" 
    onchange="updateSlider(this.value)" >

Answer 1

只是传递它，并在函数中读取其值

e.g。使用javascript

<input 
id="slide" 
type="range" 
min="0" 
max="200000" 
step="1" 
value="100000" 
onchange="updateSlider(this)" />

function updateSlider(c)
{
    if(c.value <=  50000)
  {
    if(c.step != 1)
        c.step = 1;
    alert(c.value);
  }
  else 
  {
     if(c.step != 3)
        c.step = 3;
    alert(c.value);
  }
}

在这里你可以查看小提琴http://jsfiddle.net/Lyfva/7/，我现在在这里进行检查，只有在满足某些条件时它才会改变步骤。

Answer 2

因为您使用的是javascript。为什么不用更好的方法。

试试这个Fiddle

HTML

  <input 
    id="slide" 
    type="range" 
    min="0" 
    max="200000" 
    step="1" 
    value="100000" />

的Javascript

var input = document.getElementById('slide');
input.onchange = updateSlider;

function updateSlider(event) {
  console.log(event.target.value);
}