HTML DOM Input Search Thuộc tính maxLength

Thuộc tính maxlength của Tìm kiếm đầu vào HTML DOM được sử dụng để đặt hoặc trả về thuộc tính maxlength của trường tìm kiếm đầu vào. Thuộc tính maxLength chỉ định số ký tự tối đa bạn có thể nhập vào trường tìm kiếm.

Cú pháp

Sau đây là cú pháp cho -

Đặt thuộc tính maxLength -

passwordObject.maxLength = integer

Ở đây, số nguyên chỉ định số ký tự tối đa có thể được nhập vào trường tìm kiếm. Giá trị mặc định cho giá trị này là 524288.

Ví dụ

Chúng ta hãy xem một ví dụ cho thuộc tính maxLength -

<!DOCTYPE html>
<html>
<body>
<h1>Input Search maxLength Property</h1>
<form>
FRUITS: <input type="search" id="SEARCH1" name="fruits" maxlength="5">
</form>
<p>Increase the maximum number of characters to be entered for the above search field by clicking below button</p>
<button onclick="changeMax()">CHANGE LENGTH</button>
<p id="Sample"></p>
<script>
   function changeMax() {
      document.getElementById("SEARCH1").maxLength = "15";
      document.getElementById("Sample").innerHTML = "Maximum number of characters are increased to 15";
   }
</script>
</body>
</html>

Đầu ra

Điều này sẽ tạo ra kết quả sau -

HTML DOM Input Search Thuộc tính maxLength

Khi nhấp vào THAY ĐỔI CHIỀU DÀI -

HTML DOM Input Search Thuộc tính maxLength

Trong ví dụ trên -

Đầu tiên, chúng tôi đã tạo một phần tử với type =”search”, id =”SEARCH1”, name =”fruit” và thuộc tính maxlength của nó được đặt thành 5. Thuộc tính maxlength chỉ định rằng chỉ có thể có 5 ký tự trong tìm kiếm nhất định đồng ruộng. Trường tìm kiếm nằm trong biểu mẫu -

<form> FRUITS: <input type="search" id="SEARCH1" name="fruits" maxlength="5"> </form>

Sau đó, chúng tôi tạo một nút THAY ĐỔI CHIỀU DÀI sẽ thực thi phương thức changeMax () khi người dùng nhấp vào -

<button onclick="changeMax()">CHANGE LENGTH</button>

Phương thức changeMax () sử dụng phương thức getElementById () để lấy trường đầu vào với tìm kiếm kiểu và đặt thuộc tính maxLength thành 15. Sau đó, chúng tôi sẽ hiển thị thay đổi này bằng cách hiển thị thông báo trong đoạn có id “Sample” bằng thuộc tính innerHTML của nó -

function changeMax() {
   document.getElementById("SEARCH1").maxLength = "15";
   document.getElementById("Sample").innerHTML = "Maximum number of characters are now increased to 15";
}