防止範圍字段選擇小於當前值

Question

有什麼辦法可以防止範圍輸入選擇/滑動小於當前值嗎？例如，如果我的範圍輸入的設置值爲500，例如<input type="range" min="0" max="10000" step="1" value="500">，並且不希望用戶將範圍句柄向左/小於當前值500（僅限右/超過500）滑動。

Answer 1

您可以使用min屬性，但是如果你需要的最小值限制的實際值，您可以：

• 保存當前值
• 偵聽範圍的變更，如果值小於....

的片段：

$(function() { 
 
    // save the value 
 
    var minValue = +$('input[type="range"]').val(); 
 

 
    $('input[type="range"]').on('input', function(e) { 
 
    
 
    // if the value is below minValue... 
 
    if (+$(this).val() < minValue) { 
 
     $(this).val(minValue); 
 
    } 
 
    
 
    $('#rVal').text('Range vaalue is: ' + $(this).val()); 
 
    }).trigger('input'); 
 
});

<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> 
 

 
<form> 
 
    <p id="rVal"></p> 
 
    <input type="range" min="0" max="10000" step="1" value="500" style="width: 100%;"> 
 
</form>

Answer 2

爲什麼不只是將min屬性設置爲當前值？