在 HTML5 范围输入上禁用跟踪 [英] Disable track on HTML5 range input

问题描述

我正在尝试找到一种方法来阻止用户单击 HTML5 范围输入的轨道"部分.本质上，我只希望用户能够使用句柄"来更改范围值.

I'm trying to find a way to prevent the user from clicking into the "track" portion of an HTML5 range input. Essentially, I only want the user to be able to use the "handle" to change the range value.

这可能吗?

推荐答案

至少在 chrome 上可以通过指针事件来实现.

It's possible through pointer-events at least on chrome.

input[type=range] {
pointer-events: none;
}

input[type=range]::-webkit-slider-thumb {
pointer-events:auto;
}

这将禁止点击轨道，只允许点击滑块.

This will disable clicking on the track and enable clicking only on slider thumbs.

这篇关于在 HTML5 范围输入上禁用跟踪的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！