HTML DOM Input Checkbox disabled Property

HTML DOM Input Checkbox disabled property चेकबॉक्स को सक्षम या अक्षम करने की स्थिति सेट या प्राप्त करती है। अक्षम चेकबॉक्स उपयोगकर्ता इंटरैक्शन के लिए उपलब्ध नहीं होता और फॉर्म सबमिशन में शामिल नहीं होता।

Syntax

अक्षम स्थिति प्राप्त करना:

inputCheckboxObject.disabled

अक्षम स्थिति सेट करना:

inputCheckboxObject.disabled = booleanValue

Boolean Values

booleanValue	विवरण
true	यह परिभाषित करता है कि चेकबॉक्स अक्षम है
false	यह परिभाषित करता है कि चेकबॉक्स अक्षम नहीं है और यह डिफ़ॉल्ट मान भी है

उदाहरण

कई अक्षम चेकबॉक्स को बटन क्लिक करके सक्षम करना:

<!DOCTYPE html>
<html>
<head>
<title>Student Details</title>
</head>
<body>
<form>
  <div>
    <input id="fullname" placeholder="eg: John Doe" type="text" name="fullname">
  </div>
  <div>
    जीव विज्ञान: <input class="category" type="checkbox" value="Biology" name="subject" disabled>
    गणित: <input class="category" type="checkbox" value="Mathematics" name="subject" disabled>
    भौतिकी: <input class="category" type="checkbox" value="Physics" name="subject" disabled>
    मनोविज्ञान: <input class="category" type="checkbox" value="Psychology" name="subject" disabled>
  </div>
</form>
<button onclick="enableCheckboxes()">विषय सक्षम करें</button>
<script>
  function enableCheckboxes() {
    var enableCheckboxes = document.getElementsByClassName("category");
    for (var i = 0; i < enableCheckboxes.length; i++) {
      enableCheckboxes[i].disabled = false;
    }
  }
</script>
</body>
</html>

आउटपुट

प्रारंभ में सभी विषय चेकबॉक्स अक्षम (ग्रे) दिखाई देते हैं। "विषय सक्षम करें" बटन पर क्लिक करने पर सभी चेकबॉक्स सक्षम हो जाते हैं और उपयोगकर्ता उन्हें चुन सकता है।

मुख्य बिंदु

disabled property boolean मान (true/false) स्वीकार करता है
HTML में disabled attribute उपस्थित होने पर डिफ़ॉल्ट रूप से true होता है
अक्षम चेकबॉक्स फॉर्म सबमिशन में शामिल नहीं होते
CSS में :disabled pseudo-class से अक्षम चेकबॉक्स को स्टाइल कर सकते हैं
लूप का उपयोग करके कई चेकबॉक्स को एक साथ सक्षम/अक्षम कर सकते हैं