Thuộc tính tối đa của Phạm vi đầu vào HTML DOM được sử dụng để đặt hoặc trả về giá trị thuộc tính tối đa cho điều khiển thanh trượt phạm vi. Thuộc tính này được sử dụng để chỉ ra giá trị lớn nhất của điều khiển thanh trượt và thường được sử dụng với thuộc tính min để tạo một phạm vi giá trị mà giữa đó thanh trượt có thể di chuyển.
Cú pháp
Sau đây là cú pháp cho -
Đặt thuộc tính Range max -
rangeObject.max = number
Ở đây, số đại diện cho giá trị điều khiển thanh trượt tối đa.
Ví dụ
Hãy để chúng tôi xem xét một ví dụ cho thuộc tính Phạm vi đầu vào tối đa -
<!DOCTYPE html>
<html>
<body>
<h1>Range max property</h1>
<form>
VOLUME <input type="range" id="RANGE1" name="VOL" max="75">
</form>
<p>Get the maximum value for the above slider by clicking the below button.</p>
<button type="button" onclick="maxVal()">GET MAX</button>
<p id="Sample"> </p>
<script>
function maxVal() {
var R= document.getElementById("RANGE1").max;
document.getElementById("Sample").innerHTML = "The maximum value for this range slider is "+R;
}
</script>
</body>
</html> Đầu ra
Điều này sẽ tạo ra kết quả sau -
Khi nhấp vào nút NHẬN TỐI ĐA -
Trong ví dụ trên -
Chúng tôi đã tạo một trường đầu vào chứa bên trong một biểu mẫu có type =“range”, id =“RANGE1”, name =“VOL” và giá trị thuộc tính max được đặt thành 75 -
<form> VOLUME <input type="range" id="RANGE1" name="VOL" max="75"> <form>
Sau đó, chúng tôi đã tạo một nút GET MAX sẽ thực thi phương thức maxVal () khi người dùng nhấp vào -
<button type="button" onclick="maxVal()">GET MAX</button>
Phương thức maxVal () sử dụng phương thức getElementById () để lấy trường đầu vào với phạm vi kiểu và giá trị thuộc tính tối đa của nó. Giá trị trả về biểu thị giá trị lớn nhất mà thanh trượt có thể có sau đó được gán cho biến R. Giá trị này sau đó được hiển thị trong đoạn có id “Sample” bằng cách sử dụng thuộc tính innerHTML -
function maxVal() {
var R= document.getElementById("RANGE1").max;
document.getElementById("Sample").innerHTML = "The maximum value for this range slider is "+R;
}