我有三个输入类型='范围'字段,它们具有不同的最大值但共享相同的容量。随着三个输入中的任何一个的变化,这个容量都会减少。当容量达到0时,我应该防止输入字段向右移动(从增加它们的值)并且只向左移动,但我不知道如何使用JS和jQuery执行此操作。如何防止用户拖动HTML输入type ='range'对不对?
这里是输入的html
<input type="range" class="slider" id="woodSlider" min="0" value="0" max="1558">
<input type="range" class="slider" id="ironSlider" min="0" value="0" max="2555">
<input type="range" class="slider" id="stoneSlider" min="0" value="0" max="2451">
这里是降低身份代码:
$("input").change(function() {
$("#capacityLeft").html(parseInt(holding.capacity) -
$("#woodSlider").val() -
$("#ironSlider").val() -
$("#stoneSlider").val());
if(parseInt($("#capacityLeft").html()) <= 0) {
// TODO: FIND OUT HOW TO STOP THE SLIDERS FROM MOVING
}
});
将每一个的最大值设置为'容量'减去其他两个声音的值,如开始。 – Jon
我有一个jsfiddle的工作解决方案,我可以发布一次,你分享你已经试过/你目前的代码和解释你卡住的地方。 – pawel
我编辑了问题 – vank091