แอตทริบิวต์ disabled ใน JavaScript
ใน HTML มีแอตทริบิวต์พิเศษที่ไม่มีค่า ตัวอย่างเช่น แอตทริบิวต์ disabled
ซึ่งใช้สำหรับล็อค (บล็อก) องค์ประกอบ ในการที่จะตั้งค่าแอตทริบิวต์ดังกล่าว
คุณต้องกำหนดค่าให้กับคุณสมบัติที่เกี่ยวข้องเป็น true
และเพื่อที่จะลบออก - กำหนดค่าเป็น false
มาดูในทางปฏิบัติกัน สมมติว่าเรามีอินพุตที่ถูกบล็อกอยู่:
<input id="elem" disabled>
มาดูค่าแอตทริบิวต์ disabled
ของอินพุตนี้กัน:
let elem = document.querySelector('#elem');
console.log(elem.disabled); // จะแสดงผล true
และตอนนี้มาลองปลดบล็อกมันดู:
let elem = document.querySelector('#elem');
elem.disabled = false;
กำหนดให้มีอินพุตและปุ่ม เมื่อคลิกที่ปุ่ม ให้ทำการบล็อกอินพุต
กำหนดให้มีอินพุตและสองปุ่ม ให้การคลิกที่ ปุ่มแรกบล็อกอินพุต และการคลิกที่ปุ่มที่สองปลดบล็อก
กำหนดให้มีอินพุตและปุ่ม เมื่อคลิกที่ปุ่ม ให้ตรวจสอบว่าอินพุตถูกบล็อกอยู่หรือไม่