Thuộc tính disabled của HTML DOM Option trả về và cho phép thay đổi xem phần tử option có bị vô hiệu hóa hay không.
Cú pháp
Cú pháp như sau:
1. Lấy disabled:
object.disabled
2. Thiết lập disabled:
object.disabled = true | false
Ví dụ
Dưới đây là ví dụ về thuộc tính disabled của HTML DOM Option:
<!DOCTYPE html> <html> <head> <style> html{ height:100%; } body{ text-align:center; color:#fff; background: linear-gradient(62deg, #FBAB7E 0%, #F7CE68 100%) center/cover no-repeat; height:100%; } p{ font-weight:700; font-size:1.2rem; } .drop-down{ width:35%; border:2px solid #fff; font-weight:bold; padding:8px; } .btn{ background:#0197F6; border:none; height:2rem; border-radius:2px; width:35%; margin:2rem auto; display:block; color:#fff; outline:none; cursor:pointer; } .show{ font-size:1.5rem; font-weight:bold; } </style> </head> <body> <h1>Demo DOM Option disabled</h1> <p>Chào bạn, hãy chọn môn học yêu thích:</p> <select class='drop-down' name="Drop Down List"> <option>Vật lý</option> <option>Toán học</option> <option>Hóa học</option> <option>Tiếng Anh</option> </select> <button onclick="disMaths()" class="btn">Vô hiệu hóa Toán học</button> <div class="show"></div> <script> function disMaths() { document.querySelector(".drop-down").options[1].disabled=true; document.querySelector(".show").innerHTML="Bây giờ bạn không thể chọn môn Toán học"; } </script> </body> </html>
Kết quả
Đoạn mã trên sẽ cho kết quả như sau:
Nhấn vào nút 「Vô hiệu hóa Toán học」 để vô hiệu hóa Toán học và sau đó thử chọn môn Toán học.
