คุณสมบัติ HTML DOM Input Password ถูกปิดใช้งาน ใช้สำหรับการตั้งค่าหรือส่งคืนว่าฟิลด์รหัสผ่านถูกปิดใช้งานหรือไม่ มันใช้ค่าบูลีนที่มีค่าจริงแทนองค์ประกอบที่ควรถูกปิดใช้งานและเท็จมิฉะนั้น คุณสมบัติที่ปิดใช้งานถูกตั้งค่าเป็นเท็จโดยค่าเริ่มต้น องค์ประกอบที่ถูกปิดใช้งานจะเป็นสีเทาโดยค่าเริ่มต้นและไม่สามารถคลิกได้
ไวยากรณ์
ต่อไปนี้เป็นไวยากรณ์สำหรับ −
การตั้งค่าคุณสมบัติปิดการใช้งาน -
passwordObject.disabled = true|false;
ที่นี่ ฟิลด์ true=password ถูกปิดใช้งาน และ false=ฟิลด์รหัสผ่านไม่ถูกปิดใช้งาน เป็นเท็จโดยค่าเริ่มต้น
ตัวอย่าง
ให้เราดูตัวอย่างสำหรับคุณสมบัติการป้อนรหัสผ่านที่ถูกปิดใช้งาน -
<!DOCTYPE html>
<html>
<body>
<h1>Input Password disabled Property</h1>
Password: <input type="password" id="PASS">
<p>Disable the above password field by clicking on the DISABLE button</p>
<button type="button" onclick="disablePass()">DISABLE</button>
<p id="Sample"></p>
<script>
function disablePass() {
document.getElementById("PASS").disabled=true;
document.getElementById("Sample").innerHTML = "The password field is now disabled" ;
}
</script>
</body>
</html> ผลลัพธ์
สิ่งนี้จะสร้างผลลัพธ์ต่อไปนี้ -
เมื่อคลิกปุ่มปิดการใช้งาน -
เมื่อคลิกปุ่ม “ปิดการใช้งาน” -
ในตัวอย่างข้างต้น −
ขั้นแรกเราได้สร้างช่องป้อนรหัสผ่านด้วยรหัส “PASS” และคุณสมบัติที่ถูกปิดใช้งานโดยค่าเริ่มต้นจะถูกตั้งค่าเป็น FALSE -
Password: <input type="password" id="PASS" value="abcd123">
จากนั้นเราได้สร้างปุ่ม DISABLE ที่จะรันเมธอด disablePass() เมื่อผู้ใช้คลิก -
<button type="button" onclick="disablePass()">DISABLE</button>
เมธอด disablePass() ใช้เมธอด getElementById() เพื่อรับฟิลด์อินพุตที่มีรหัสผ่านประเภท และตั้งค่าคุณสมบัติที่ปิดใช้งานเป็นจริง สิ่งนี้จะปิดใช้งานฟิลด์รหัสผ่านและทำให้เป็นสีเทา จากนั้นเราจะแสดงข้อความโดยใช้คุณสมบัติ innerHTML ของย่อหน้าที่มีรหัส "ตัวอย่าง" ซึ่งระบุว่าช่องรหัสผ่านถูกปิดใช้งานในขณะนี้ -
function disablePass() {
document.getElementById("PASS").disabled=true;
document.getElementById("Sample").innerHTML = "The password field is now disabled" ;
} 