คุณสมบัติ maxLength ของ Input Password ใน HTML DOM

คุณสมบัติ maxLength ของ Input Password ใน HTML DOM ใช้สำหรับตั้งค่าหรือคืนค่าแอตทริบิวต์ maxlength ของช่องป้อนรหัสผ่าน ระบุจำนวนตัวอักษรสูงสุดที่พิมพ์ได้ในช่องรหัสผ่าน

ไวยากรณ์ (Syntax)

การตั้งค่าคุณสมบัติ maxLength:

passwordObject.maxLength = integer

integer ระบุจำนวนตัวอักษรสูงสุดที่พิมพ์ได้ในช่องรหัสผ่าน

ตัวอย่าง

ตัวอย่างการเพิ่มจำนวนตัวอักษรสูงสุดของช่องรหัสผ่าน:

<!DOCTYPE html>
<html>
<body>
<h1>คุณสมบัติ maxLength ของ Input Password</h1>
Password: <input type="password" id="PASS" maxLength="5">
<p>คลิกปุ่มด้านล่างเพื่อเพิ่มจำนวนตัวอักษรสูงสุดของช่องข้างบน</p>
<button onclick="changeMax()">CHANGE LENGTH</button>
<p id="Sample"></p>
<script>
  function changeMax() {
    document.getElementById("PASS").maxLength = "15";
    document.getElementById("Sample").innerHTML = "จำนวนตัวอักษรสูงสุดเพิ่มเป็น 15 แล้ว";
  }
</script>
</body>
</html>

ผลลัพธ์

เมื่อโหลดหน้าเว็บ ช่องรหัสผ่านพิมพ์ได้สูงสุด 5 ตัวอักษร

เมื่อคลิกปุ่ม "CHANGE LENGTH" จะเปลี่ยนเป็นพิมพ์ได้ 15 ตัวอักษร และแสดงข้อความยืนยัน

คำอธิบายโค้ด

• สร้างช่องรหัสผ่าน id="PASS" มี maxLength="5" (พิมพ์ได้ 5 ตัว)
• สร้างปุ่ม "CHANGE LENGTH" เรียกใช้ changeMax() เมื่อคลิก
• ฟังก์ชัน changeMax() ดึงช่องรหัสผ่าน ตั้งค่า .maxLength = "15"
• แสดงข้อความยืนยันในย่อหน้า id="Sample"