有一个HTML5特性，它使用list属性和匹配的datalist元素提供了本地的止动捕捉。列表中的每个元素都成为滑块中的止动点，带有刻度标记和捕捉。

<input type="range" value="0" min="0" max="60000" step="1" list="my-detents">

<datalist id="my-detents">
  <option value="30000">
</datalist>

字符串
datalist元素可以放在HTML中的任何位置;它只是定义了input元素使用的列表（这里命名为my-detents）。
根据MDN和caniuse.com，截至2019年2月，Chrome、IE、Edge和Safari预览版支持使用datalist和range输入。（Firefox仅支持text输入的datalist。）

我不确定你到目前为止已经尝试了什么，或者你的实际目标是什么。但我的理解是，如果选择了范围中间三分之一的值，你希望它选择中间值。下面是我的例子。
超文本标记语言：

<input id="slider1" type="range" min="0" max="500" step="20" />

字符串
JQuery：

$('#slider1').change( function() {
    var cVal =  $(this).val(); 
    if (cVal >= 200 && cVal <= 300) {
        $('#slider1').val("250");
    }
});

型
因此，如果一旦改变它等于200和300之间的任何地方，它将默认为250。这里的问题是，它将值设置为250，而不仅仅是caretPosition。您可以根据需要更改所有设置。有一个插件，我以前没有使用过，称为jQuery Caret，如果您想保留选定的值并更改位置，可能会更好地帮助，但再次我没有使用它。