禁用键盘用于输入范围

时间:2018-05-03 12:20:58

标签: javascript html

我有一个带滑块的标准表格:

`<input type="range" min="0" max="100" value="50" id="my_slider" name="my_slider">`

可以使用鼠标或箭头键(单击滑块后)选择滑块的值。如何禁用键盘并强制用户使用鼠标定位滑块?

显然,有一种可能性是使用Java Script禁用整个页面上的箭头键,但我想尽可能避免使用它。

谢谢。

2 个答案:

答案 0 :(得分:2)

您可以在输入中添加一个键监听器,并在事件上调用Event.preventDefault(),这将取消它,防止触发默认操作:

&#13;
&#13;
var mySlider = document.getElementById("my_slider");

mySlider.addEventListener("keydown", function(event) {
    event.preventDefault();
    return false;
});
&#13;
<input type="range" min="0" max="100" value="50" id="my_slider" name="my_slider">
&#13;
&#13;
&#13;

答案 1 :(得分:1)

您可以使用onkeydown事件来阻止密钥...

&#13;
&#13;
<input type="range" min="0" max="100" value="50" id="my_slider" name="my_slider"
 onkeydown="event.preventDefault()">
&#13;
&#13;
&#13;