Javascript 如何在范围滑块中跳到下一个值，步骤仅允许数字

我正在创建一个范围滑块，根据用户在滑块上选择的范围显示具有容量的不同场地和显示/隐藏画廊

我的容量是[50100200300500]

Q1 我希望我的范围滑块自动转到下一个值，而不是其通常的步长（当前设置为50）

Q2 我的滑块是否可以包含字符串而不是数字，就像我想显示的，[小型、中型、大型]场地一样

我是新手，如果有办法，请告诉我， 这里还有代码，如果有更简单的方法，请告诉我

非常感谢你的时间和帮助

这是密码

.slidecontainer{
宽度：100%；
}
.滑块{
-webkit外观：无；
宽度：100%；
高度：15px；
边界半径：5px；
背景#d3；
大纲：无；
不透明度：0.7；
-webkit转换：.2s；
转变：不透明度；
}
.滑块：悬停{
不透明度：1；
}
.滑块：：-webkit滑块拇指{
-webkit外观：无；
外观：无；
宽度：25px；
高度：25px；
边界半径：50%；
背景：#1A77B9；
光标：指针；
}
.滑块：：-moz范围拇指{
宽度：25px；
高度：25px；
边界半径：50%；
背景#4CAF50；
光标：指针；
}
幻灯片显示接地所需的容量
场馆容量：

场地C可容纳60人
场地Q可容纳70人
临时工4
var smallCap=[50100200300500]；
var容量；
变量inputTemplate=''
inputTemplate=inputTemplate.replace（“{min}”，smallCap[0]）。replace（“{max}”，smallCap[smallCap.length-1]）。replace（“{value}”，smallCap[0]）；
$（'.slidecontainer'）.prepend（inputTemplate）；
var slider=document.getElementById（“myRange”）；
var输出=document.getElementById（“演示”）；
output.innerHTML=slider.value；
slider.oninput=函数（）{
myfunction（this.value）；
}
函数myfunction（值）{
output.innerHTML=值；
document.querySelectorAll（'.venture'）.forEach（item=>{item.style.display='none'；}）
var元素=document.querySelector（'.vention[data capacity=“'+value+'”）；
if（元素）{
element.style.display='block'；
}
}
myfunction（smallCap[0]）；

欢迎使用堆栈溢出！你提出了一个措词恰当的问题，但你缺少代码。如果看不到滑块背后的代码，就无法判断滑块是如何工作的。很抱歉，我以前没有输入代码，我现在已将其嵌入到上面，很抱歉，我是堆栈溢出新手。谢谢你指出。欢迎来到堆栈溢出！你提出了一个措词恰当的问题，但你缺少代码。如果看不到滑块背后的代码，就无法判断滑块是如何工作的。很抱歉，我以前没有输入代码，我现在已将其嵌入到上面，很抱歉，我是堆栈溢出新手。谢谢你指出这一点。