Thuộc tính min của Input Range trong HTML DOM

Thuộc tính min của HTML DOM Input Range được sử dụng để thiết lập hoặc trả về giá trị thuộc tính min cho điều khiển thanh trượt range. Thuộc tính này chỉ định giá trị tối thiểu của thanh trượt và thường dùng cùng max để tạo khoảng giá trị mà thanh trượt có thể di chuyển.

Cú pháp

Cú pháp để thiết lập thuộc tính min của Range:

rangeObject.min = number

Ở đây, number đại diện cho giá trị tối thiểu của thanh trượt.

Ví dụ

Ví dụ minh họa cho thuộc tính min của Input Range:

<!DOCTYPE html> <html> <body> 
<h1>Thuộc tính min của Range</h1> 
<form> 
ÂM LƯỢNG <input type="range" id="RANGE1" name="VOL" min="15"> 
</form> 
<p>Lấy giá trị tối thiểu cho thanh trượt trên bằng cách nhấn nút dưới đây.</p> 
<button type="button" onclick="minVal()">LẤY MIN</button> 
<p id="Sample"> </p> 
<script> 
    function minVal() { 
        var R=document.getElementById("RANGE1").min; 
        document.getElementById("Sample").innerHTML = "Giá trị tối thiểu cho thanh trượt này là: "+R; 
    } 
</script> </body> </html>

Kết quả

Đoạn mã trên sẽ tạo ra kết quả như sau:

Khi nhấn nút LẤY MIN:

Trong ví dụ trên:

Chúng ta tạo trường input trong form với type="range", id="RANGE1", name="VOL" và min="15":

<form> ÂM LƯỢNG <input type="range" id="RANGE1" name="VOL" min="15"> </form>

Tạo nút LẤY MIN thực thi phương thức minVal() khi được nhấn:

<button type="button" onclick="minVal()">LẤY MIN</button>

Phương thức minVal() dùng getElementById() lấy trường range và giá trị thuộc tính min. Giá trị trả về (giá trị tối thiểu thanh trượt) gán cho biến R và hiển thị trong đoạn văn id="Sample":

function minVal() { 
    var R= document.getElementById("RANGE1").min; 
    document.getElementById("Sample").innerHTML = "Giá trị tối thiểu cho thanh trượt này là: "+R; 
}