在输入类型范围内禁用跟踪点击

问题描述：

我想在输入类型范围内禁用跟踪单击，仅允许通过拇指拖动。

I want to disable track click on input type range, Only allow drag through thumb.

我能够在除Microsoft Edge和Internet Explorer之外的所有浏览器中做到这一点。

I am able to do it in all browsers except Microsoft Edge and Internet Explorer.

我正在这样做

#slider {
  display: block;
  width: 400px;
  height: 40px;
  margin: 0px auto;
  padding: 5px 10px;
  z-index: 20;
  border-radius: 20px;
  pointer-events: none;
}

#slider::-moz-range-thumb {
  pointer-events: auto !important;
}

#slider::-webkit-slider-thumb {
  pointer-events: auto !important;
}

#slider::-ms-thumb {
  pointer-events: auto !important;
}

#slider::-ms-track {
  pointer-events: none !important;
}

<input id="slider" type="range" value="0" min="0" max="100" autocomplete="off" />

请查看为什么它不起作用在Microsoft Edge和Internet Explorer上，并提出任何可行的方法。

Please see why its not working on Microsoft Edge and Internet Explorer and suggest any possible way to do it.

谢谢

答

使用jquery
禁用

using jquery to disable

$（ input [name = Range]）。css（指针事件，无）；
$（ input [name = Range]）。css（ disabled， disabled）;

$("input[name=Range]").css("pointer-events","none"); $("input[name=Range]").css("disabled","disabled");

正常

$（ input [name = Range]）。css（ pointer-events， auto）;
$（ input [name = amountRange]）。removeAttr（ disabled）;

$("input[name=Range]").css("pointer-events","auto"); $("input[name=amountRange]").removeAttr("disabled");

在输入类型范围内禁用跟踪点击

相关推荐